is there a way to toggle multiple CSS classes in one statement?

i have a class called active that i would like to add to all my side-bar_menu-text classes on the click of a button, but it only adds this class to the first element. my code: const collapseMenuBtn = document.getElementById('collapse-menu'); const sideBarMenuText = document.querySelectorAll('.side-bar_menu-text'); collapseMenu.addEventListener('click', () => { console.log('collapse menu') sideBarMenuText.classList.toggle('active'); });
4 Replies
Jochem
Jochem2y ago
you have to loop over the list, no way to do it all in one go
winniffy
winniffy2y ago
if i loop over the list, doesn't it loop over the list and adds the style to the last element?
Jochem
Jochem2y ago
collapseMenu.addEventListener('click', () => {
console.log('collapse menu')
sideBarMenuText.forEach(elem => elem.classList.toggle('active'));
});
collapseMenu.addEventListener('click', () => {
console.log('collapse menu')
sideBarMenuText.forEach(elem => elem.classList.toggle('active'));
});
nope in fact, what you pasted shouldn't even work at all, you should be getting something about classList not being a property of Array
winniffy
winniffy2y ago
it does work tho this worked. incredible. thank you
Want results from more Discord servers?
Add your server