title: How do I prevent a click handler being triggered when a child element is clicked?
body: <p>I have two div tags, first div is the father and the second div is son Inside the father like this</p>
  
  <pre><code>&lt;div id="father"&gt; 
  &lt;div id="son"&gt; &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And I've added an event (onclick) in div father like this</p>
  
  <pre><code>&lt;div id="father" onclick="closeFather()"&gt; 
  &lt;div id="son"&gt; &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>My question</strong> is why the son inherits the father in the event.</p>
  
  <p>I want when I click on the Father div implement the event, but when i click on the son does not implement anything because it does not have any event.</p>