# Open Only One Details Block at a Time

> Makes neighboring Details blocks behave like an accordion: opening one question closes the others in the same group, which keeps long FAQs tidy.

- Type: JavaScript
- Runs: Site-wide footer
- Category: [Frontend & Design](https://wpide.com/library/category/frontend/)
- Tags: details, accordion, faq
- Author: WPIDE Team
- Installs: 0
- Updated: 2026-10-28
- Page: https://wpide.com/library/frontend-exclusive-details-accordion/

## Code

```javascript
document.addEventListener('toggle', function (e) {
    var details = e.target;
    if (!details.matches || !details.matches('details.wp-block-details') || !details.open) { return; }
    var parent = details.parentElement;
    if (!parent || parent.classList.contains('wpide-multi-open')) { return; }
    Array.prototype.forEach.call(parent.children, function (sibling) {
        if (sibling !== details && sibling.matches('details.wp-block-details') && sibling.open) { sibling.open = false; }
    });
}, true);
```

## Notes

Applies to Details blocks that sit next to each other in the same parent block. Add the class wpide-multi-open to the parent to allow several open at once.

## How to use it

Install the free WPIDE plugin (https://wordpress.org/plugins/wpide/), find "Open Only One Details Block at a Time" in its snippet library and add it in one click; or create a new JavaScript snippet in WPIDE (or any code snippets plugin) and paste the code above. More snippets: https://wpide.com/library/