I am trying to use JavaScript to change the text of this element. However it is not working. Here is the header im trying to change - enter image description here
var elem = document.getElementsByClassName("headertext");
elem.innerHTML = "hello world";
<ul class="headertable">
<li>
<p class="headertext">Home</p>
</li>
<li>
<p class="headertext">About US</p>
</li>
<li>
<p class="headertext">Contact US</p>
</li>
</ul>
document.getElementsByClassName returns an array-like object of all child elements which have all of the given class name(s).
Here the elem will be an HTMLCollection. So elem.innerHTML is not valid.
So you should use the index to update the required node
like elem[0].innerHTML or elem[1].innerHTML or elem[2].innerHTML
var elem = document.getElementsByClassName("headertext");
elem[0].innerHTML = "hello world";
elem[1].innerHTML = "hello world 1";
elem[2].innerHTML = "hello world 2";
<ul class="headertable">
<li><p class="headertext">Home</p></li>
<li><p class="headertext">About US</p></li>
<li><p class="headertext">Contact US</p></li>
</ul>