1

I have tried so many ways to simply get a class to change on an image when I hover over a menu item and it is driving me bonkers. If someone can help me get this straight I would appreciate some help... In the end I will have three of these in place, one for Red, Yellow, and Blue... here is what I have for one example...

<script>
const triggerRed = document.getElementsByClassName('gardenBtn');
const redIMG = document.getElementById('gardenMe');
// ️ Change
triggerRed.addEventListener('mouseover', function handleMouseOver() {
  list = redIMG.classList;
  list.remove('risoMe');
});
// ️ Change back
triggerRed.addEventListener('mouseout', function handleMouseOut() {
  list = redIMG.classList;
  list.add('risoMe');
}); 
</script>

But nothing changes

greglang
  • 11
  • 2
  • 3
    `getElementsByClassName` returns a whole collection of items and you have to add your event listeners to each item, not the whole collection. – takendarkk Sep 22 '22 at 15:37
  • Code doesn't belong in comments. Please see [ask], then provide enough information so we can answer. Some HTML would be great, in a snippet demo using the editor. – isherwood Sep 22 '22 at 16:16

0 Answers0