Kevin Powell - Community•2y ago

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•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 😉

MyndiOP•2y ago

was so obsessed with everything else that I forgot LOL

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

MyndiOP•2y ago

Well thanks, let's pretend this didn't happen.

13eck•2y ago

[it's a deal] https://tenor.com/bmGuM.gif

Gaming

Programming

What is wrong with this function?