I have a parent element DIV that has children div elements. I have separate click implementations for parent and its children.
<div id="mainContainer">
<div id="childContainer">
</div>
<div id="childContainer2">
</div>
</div>
$('#mainContainer').click(function () {
console.log('main container');
}).children().click(function () {
console.log('childen');
return false;
});
$('#childContainer2').click(function () {
console.log('child container 2');
});
This is working fine. but if I click a child then the event runs twice which is how it is supposed to work. My question is - Is there a way that I can explicitly write event to parent that would not affect children so that children need not execute click function twice?