querySelectorAll() not working | SoloLearn: Learn to code for FREE!


querySelectorAll() not working

I'm trying to give sections a class of 'your-active-class' which has a style on CSS. So i want to give these sections that class so when a user hovers on the section, it looks active but querySelectorAll() is not working as well as getElementsByTagName() so i had to use querySelector()but it only selects the first section //Add active class to the active section let activeSection = document.getElementsByClassName("my-section").length; document.querySelector(".my-section").addEventListener("mouseover", function mouseOver() { document.querySelector(".my-section").classList.add('your-active-class'); } ); //Remove activeness let inActiveSection = document.querySelector('.my-section').addEventListener("mouseout", function mouseOut() { document.querySelector('.my-section').classList.remove('your-active-class'); } );

4/30/2020 2:29:57 PM

Marina Khamis

1 Answer

New Answer


I also tried this but it only selected the first sction only . let elementsArray = document.querySelectorAll(".my-section"); elementsArray.forEach(function(elem) { elem.addEventListener("mouseover", function() { document.querySelector(".my-section").classList.add('your-active-class'); }); });