Как мне изменить innerText на элементе li с помощью JavaScript

Question

Этот код после загрузки браузера. Мне нужно изменить li учебный класс buddyName - "Страйдер" в "Арагон".

<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>

Это была моя последняя попытка, но она не сработала:

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

Answer 1

Вы бы использовали getElementsByClassName чтобы получить все li теги. Следующим шагом является выбор четвертого элемента массива и изменение значения.

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