Как можно переделать данный скрипт аккордеона под функцию, чтобы можно было использовать несколько раз на сайте?

Question

[jeka-3]

Как можно переделать данный скрипт аккордеона под функцию, чтобы можно было использовать несколько раз на сайте?

let accordeonLink = document.querySelectorAll('.accordion-item__link'),
      accordeonItem = document.querySelectorAll('.accordion-item');

  accordeonLink.forEach((item) => 
    item.addEventListener('click',  () => {
      let parent = item.parentNode;

      if (parent.classList.contains('accordion-item__active')) {
        parent.classList.remove('accordion-item__active');
      } else {
        accordeonItem.forEach((child) => child.classList.remove('accordion-item__active'))
      }

      parent.classList.toggle('accordion-item__active');

    })
  );

Или может у кого-то есть аналоги?

Comments

[Антон]

Так и сделать. Обернуть в функцию и в качестве параметра передавать селектор

Answer 1

[Tim]

Примерно так. Без html сложно угадать

document.addEventListener('click', (event) => {
   let el = event.target //элемент по которому кликнули

   if (el.classList.contains('accordion-item__active')) {
     el.classList.remove('accordion-item__active');
   } else {
     document.querySelectorAll('.accordion-item__active').forEach(i => i.classList.remove('accordion-item__active'))
   }

   el.classList.toggle('accordion-item__active');

 })