I want to console log the button every time the button is clicked but if I click any child element within the button, the child gets printed instead which is not I want. How do I make sure the element which has the event listener is printed?
const onCrossClick = (e) => {
console.log(e.target);
};
<button
className="delete-button"
onClick={onCrossClick}
>
<i className="fas fa-times-circle fa-2x"></i>
</button>
const onCrossClick = (e) => {
console.log(e.currentTarget);
};
<button
className="delete-button"
onClick={onCrossClick}>
<i className="fas fa-times-circle fa-2x"></i>
</button>
Use closest().
const onCrossClick = (e) => {
console.log(e.target.closest("button"));
};