How to ONLY trigger parent click event when a child is clicked

Question

Both child and parent are clickable (child could be a link or div with jQuery click events). When I click on child, how do I only trigger parent click event but not the chil

Answer 1

Another option for this that may be useful in certain circumstances when you know that none of the child elements are interactive is to set pointer-events: none in your css (link). I usually apply it to all child elements of the element on which I want to capture interaction. Like this:

#parentDiv * {
    pointer-events: none
}

Note the *, declaring that the rule applies to all children of the parentDiv.