Skip to content

Instantly share code, notes, and snippets.

@auniverseaway
Created November 10, 2021 18:58
Show Gist options
  • Save auniverseaway/8e9d73d7df4e26abef151a9be390ccb6 to your computer and use it in GitHub Desktop.
Save auniverseaway/8e9d73d7df4e26abef151a9be390ccb6 to your computer and use it in GitHub Desktop.
function decorateAccordion(el) {
const titles = el.querySelectorAll(':scope > div:nth-child(odd)');
titles.forEach((title) => {
// Add a class to the title container
title.classList.add('item-title');
// Remove the empty div
title.querySelector(':scope > div:last-of-type').remove();
// Add a class to the content
title.nextElementSibling.classList.add('item-content');
// Add a click handler to open the content
title.addEventListener('click', () => {
title.classList.toggle('open');
});
});
}
const els = document.querySelectorAll('.accordion');
els.forEach((el) => {
decorateAccordion(el);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment