I seem to have hit a roadblock, likely related to the use of bind
, however, I can't pinpoint the issue. I am able to add a class to a body tag, but struggling to remove it later on.
const add_body_class = document.querySelectorAll('.btn-add-class');
add_body_class.forEach(item => {
item.addEventListener('click', event => {
document.body.classList.add('foobar');
})
});
const remove_body_class = document.querySelectorAll('.btn-remove-class');
remove_body_class.forEach(item => {
item.addEventListener('click', event => {
// this doesn't work
document.body.classList.remove('foobar');
// click event works
console.log("clicked");
})
});
By the way, I need to utilize multiple selectors and document.querySelectorAll
due to having multiple instances in the code that cannot be modified.
Any assistance would be greatly appreciated!