How do I access a particular part of an HTML tag?

Question

I am using console on google chrome to edit the web page. I could just use inspect element and change what I am trying to change, but after discovering I could do this on the console... I wanted to do it that way.

Here is the code of the website as it is now:

Name:Mountain, Rocky 

I am trying to replace Mountain, Rocky so it says "Mountain, Appalachia"

So far, I've tried: document.getElementByTagName("li")[12].replaceWith("Name:Mountain, Rocky ");

and lots of other combinations (replacing the quotes inside the replaceWith with &quot, just writing "Name: Mountain, Appalachia&nbsp" and nothing works

most of the time the change I want to make shows up in the "Name:" part and the Mountain, Rocky goes away.

How do I maintain the Name: and the Mountain part of the code?

Answer 1

I assume that document.getElementByTagName("li")[12] is your <li> element. To change inner text of element you can use:

• innerText - document.getElementByTagName("li")[12].innerText = 'Mountain, Appalachia'
• innerHTML - document.getElementByTagName("li")[12].innerHTML = 'Mountain, Appalachia'

Similiar questions were answered many times. For example here