Не получается выбрать элемент с помощью document.querySelectorAll

Я - новичок. В указанном HTML с помощью чистого JS не получается корректно выбрать все 3 элемента с классом slider__button А именно в Nodelist первый элемент пустой (который должен соответствовать элементу

<li class="slider__button slider__button_active">),

другие два корректные. Подскажите, плиз, что делаю не так.

Код:

let sliderButton = document.querySelectorAll(".slider__button");

console.log(sliderButton);
<ul class="slider">
  <li class="slider__button slider__button_active">
    <a href="#" class="slider__button-link slider__button-link_active">1</a>
  </li>
  <li class="slider__button">
    <a href="#" class="slider__button-link">2</a>
  </li>
  <li class="slider__button">
    <a href="#" class="slider__button-link">3</a>
  </li>
</ul>


Ответы (1 шт):

Автор решения: Igor

первый элемент пустой

Что это значит?


let sliderButtons = document.querySelectorAll(".slider__button");
for (let i = 0; i < sliderButtons.length; i++) {
  console.log(sliderButtons[i].innerText);
}
    <ul class="slider">
      <li class="slider__button slider__button_active">
        <a href="#" class="slider__button-link slider__button-link_active">1</a>
      </li>
      <li class="slider__button">
        <a href="#" class="slider__button-link">2</a>
      </li>
      <li class="slider__button">
        <a href="#" class="slider__button-link">3</a>
      </li>
    </ul>

→ Ссылка