We've already used `innerHTML` quite a bit here, but I want to quickly show you
a little more about it.
First, let's look at our example, right here where we set `innerHTML`.
I've just passed in a string, "all about cats".
But, in fact, I could put HTML tags inside that string.
So I could surround "cats" with `` tags,
and you can see it shows up emphasized.
Or down here, where I change "dog" to "cat",
I could surround this with `` tags,
and it shows up strong, bold.
I could even write an `` tag inside here, or put an entire webpage's
HTML in here, if I really wanted.
So that's pretty neat, because it means we can do a lot with `innerHTML`.
If we're only changing the text, actually, we don't even need to use `innerHTML`.
We can just use the `textContent`property, and that means that browser
won't interpret what you pass as HTML, and will just render it as plain text.
Notice if I change this to `textContent`,
my brackets show up-- gross!
So, in that case, we're just going to get rid of them, because the browser
refuses to turn them into actual HTML.
So if you do want to just set the text, just use `textContent`.
If you want to pass in some HTML tags, and have them interpreted as HTML,
then use `innerHTML`.
Once you start doing more advanced DOM manipulation,
you should be more careful about using `innerHTML` and `textContent`,
because they'll also remove event listeners
that you've attached to the elements inside,
which you'll learn how to do soon.
In the next talk-through, I'll show you a more sophisticated way
to insert new elements and text in your page.