Аккордеон на чистом JS?

Question

[ForSureN1]

Имеется блок с аккордеоном.
Создаю 2 консты для получения "массивов" с элементами.
При клике на любой из элемент, открывается весь аккордеон, а не тот, на который мы только кликнули, прошу подсказать что неправильно делаю.

+ ошибка в консоле появляется после клика на блок
Uncaught TypeError: Cannot read property 'classList' of undefined
at HTMLDivElement.textdown (script.js:20)

Comments

[V Sh.]

Вы в функции textdown оббегаете весь массив. Нужно только лишь по активному элементу. Вернее будет сделать так: сначала у всех блоков отобрать классы на "показ", а затем присвоить классы на "показ" лишь активному элементу.

[ForSureN1]

V Sh., если такая возможность имеется, прошу продемонстрировать

[V Sh.]

Евгений Бабенко, просто поменяйте. как-то так.

function textdown() {
		let active = this.parentNode.querySelector(".elem-bot");
    active.classList.toggle('active_text');
		//arrow[i].classList.toggle('arrow_rotate');
  }

Answer 1

[Чипекве]

const accordTitles = document.querySelectorAll('.elem-top');

accordTitles.forEach(title => {
  title.addEventListener('click', textdown)
})

	function textdown({currentTarget}) {
		currentTarget.nextElementSibling.classList.toggle('active_text');
    currentTarget.querySelector('.faq__arrow').classList.toggle('arrow_rotate');
	};

Comments

[ForSureN1]

Дай бог вам здоровья !