Wie ändere ich den inneren Text auf dem li-Element mit JavaScript

Question

Dieser Code ist nach dem Laden des Browsers. Ich muss die li Klasse buddyName - "Strider" zu "Aragon" ändern.

<script src="./scripts/fellowship.js"></script> 
<main> 
    <section id="Middle-Earth"> 
     <article class="the-shire">...</article> 
     <article class="rivendell"> 
      <h1>Rivendell</h1> 
      <aside> 
       <ul id="myBuddy"> 
        <li class="buddyName">Gandalf the Grey</li> 
        <li class="buddyName">Legolas</li> 
        <li class="buddyName">Gimli</li> 
        <li class="buddyName">Strider</li> 
        <li class="buddyName">Boromir</li> 
       </ul> 
      </aside> 
     </article> 
     <article class="morder">...</article> 
    </section> 
</main> 

Das war mein letzter Versuch, aber nicht funktioniert:

document.querySelectorAll('buddyName'[3]).innerHTML = "Aragorn"; 

Answer 1

Sie würden getElementsByClassName verwenden, um alle li-Tags zu erhalten. Der nächste Schritt ist das vierte Element des Arrays auszuwählen und den Wert zu ändern.

document.getElementsByClassName('buddyName')[3].innerHTML= "Aragorn";