details-element.js
1
2
3
4
5
6
7
8
9
// Close any open <details> elements if we click on anything that _isn't_ a <details> element
// We rely on the name="..." attribute to handle mutual exclusion
document.addEventListener('click', (e) => {
const detailsElements = Array.from(document.querySelectorAll('details'));
if (!detailsElements.some(el => el.contains(e.target))) {
detailsElements.forEach(el => el.removeAttribute('open'));
}
});