не могу понять какая ошибка в коде JS

var next = document.getElementsByClassName("next1");
next.addEventListener("click", function(){
alert("hello");
});

при запуске браузер ругается: script.js:8 Uncaught TypeError: next.addEventListener is not a function at script.js:8

подскажите что тут не так?


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

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

//  навешиваем обработчики клика после события загрузки страницы,
// иначе скрипт может не найти элементы, на которые нужно повесить клики
window.addEventListener('load', () => {
  console.log('load');
  // находим все элементы с классом next1, 
  // преобразуем в массив и кладем в переменную 
  var next = [...document.getElementsByClassName("next1")];
  //на каждый элемент из массива навешиваем клик
  next.forEach(i => i.addEventListener("click", function() {
    alert("hello");
  }));
});
<button type="button" class="next1">Button</button>
<button type="button" class="next1">Button</button>
<button type="button" class="next1">Button</button>

→ Ссылка