When I click on a link, I want to handle just that one element. However, when I click on another link, the active class is not being removed from the previous ones. Can anyone offer assistance with this issue? Here's my code:
let parentT = document.querySelector('.menu-item'); //PARENT
let allEl = parentT.querySelectorAll('a'); // ELEMENTS INSIDE PARENT
allEl.forEach(elem =>{
elem.addEventListener('click', (event) => {
event.preventDefault();
event.target.setAttribute('class', 'active');
if(event.target.classList == "active") {
console.log(event.target);
}
});
});
I have tried some methods but haven't achieved the desired result.