Почему не добавляется класс следующему элементу после 2 клика?

Question

[dima89e]

Comments

[ProjectSoft]

В функции

const btn = document.querySelector('.btn');

Выбирается всегда первый элемент.

const btn = document.querySelector('.btn');
const nextBtn = document.querySelector('.next')

btn.classList.add('active');

nextBtn.addEventListener('click', () => {
  console.log('e');
  const btn = document.querySelector('.btn.active');
  if(btn.nextElementSibling.classList.contains('btn')){
    btn.nextElementSibling.classList.add('active');
    btn.classList.remove('active');
  }
});

Answer 1

[Ivan Bogachev]

Метод querySelector возвращает первый элемент, который соответствует селектору. В вашем конкретном случае querySelector('.btn') - это всегда первая кнопка. Тут вопрос не в количестве кликов, а в том, что логика действий завязана на первую кнопку.