I am looking to implement a function where an element is manipulated if a child of it is clicked (by adding a CSS class to it).
My current approach is as follows:
function mahlzeitRaus() {
console.log("Out");
//this.className += " not";
this.parentElement.className += " not";
}
Additionally,
window.onload = function() {
document.getElementsByClassName('trigger_mahlzeit_delete')[0].addEventListener('click', mahlzeitRaus);
}
I have two questions related to this issue, which I understand may not be ideal but are interconnected:
1. When using ('trigger_mahlzeit_delete')[0], I am only targeting the first element with that class. How can I modify my code to target each element individually when clicked?
2. It seems that targeting the parent element is not functioning correctly, although something is logged in the console. I suspect the way I am targeting the parent element is incorrect (which may also relate to the previous question), so how can I correct this?
Thank you