Tell us what’s happening:
When I click one button, all three are activated. I tried a for loop and the same thing happens. What’s the error?
const nodeList = document.querySelectorAll(“.favorite-icon”); //It is an array
nodeList.forEach(function (item){
item.addEventListener(“click”, changeColor);
});
const iconList = document.querySelectorAll(“.empty-heart”);
function changeColor() {
iconList.forEach(function(item){
item.innerHTML = “
”;
item.classList.toggle(“filled”);
})
}
Your code so far
<!-- file: index.html -->
/* file: styles.css */
/* file: script.js */
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:139.0) Gecko/20100101 Firefox/139.0
Challenge Information:
Build a Favorite Icon Toggler - Build a Favorite Icon Toggler