What is wrong with this function?

It should loop over the elements, and add the class active when hovering (and it should remain active until I hover on another hoverable). https://codepen.io/myntsu/pen/JjaYJed
Myndi
CodePen
JjaYJed
...
5 Replies
13eck
13eck•2y ago
function setActiveParagraph() {
const paragraphs = document.querySelectorAll(".hoverable");
paragraphs.forEach((paragraph) => {
paragraph.addEventListener("mouseover", () => {
const activeParagraph = document.querySelector(".active");
if (activeParagraph) {
activeParagraph.classList.remove("active");
}
paragraph.classList.add("active");
});
});
}

// You need to call the function
// in order for it to run!
setActiveParagraph();
function setActiveParagraph() {
const paragraphs = document.querySelectorAll(".hoverable");
paragraphs.forEach((paragraph) => {
paragraph.addEventListener("mouseover", () => {
const activeParagraph = document.querySelector(".active");
if (activeParagraph) {
activeParagraph.classList.remove("active");
}
paragraph.classList.add("active");
});
});
}

// You need to call the function
// in order for it to run!
setActiveParagraph();
You forgot to call the function 😉
Myndi
Myndi•2y ago
myndiFacepalm was so obsessed with everything else that I forgot LOL
13eck
13eck•2y ago
Don't fret, Myndi! There are a lot of people who make that mistake…myself included when I first started with JS
Myndi
Myndi•2y ago
Well thanks, let's pretend this didn't happen.
13eck
13eck•2y ago
Want results from more Discord servers?
Add your server