Help with my FAQ Accordian

[coffeesolutions]

Hi, I'm having trouble with my FAQ. I want answers to automatically close when someone clicks on a new question. (only one answer open at a time). I'm using the whisk theme, and here is a link to the page in question: https://www.brandroastsupply.com/pages/faq

Any help would be appreciated, Thanks!

[SafeerAhmed]

Hey,
search for questions.liquid and paste it or paste it in theme.liquid just before the closing </body> tag

<script>
const faqs = document.querySelectorAll('details');
faqs.forEach((faq) => {
    faq.addEventListener('click', function() {
        faqs.forEach((otherFaq) => {
            if (otherFaq !== faq) {
                otherFaq.removeAttribute('open');
            }
        });
    });
});
</script>

[namphan]

Hi @coffeesolutions,

You want it to be grouped, like 'WHO ARE WE AND WHO ARE WE FOR?' or 'OUR COFFEE' or whatever question is displayed, the other question will be closed?