title: Jquery disable click event for div
body: <p>Let's say I got a simple click event for a HTML div.
  If I click on the div it should trigger a fadeToggle.</p>
  
  <p>In that div I got another div with another trigger.
  On that click event it should do something but instead of doing the event it triggers the first event.</p>
  
  <p>How do I prevent event 1 from triggering if I want event2 to trigger?</p>
  
  <p>Event1 should trigger only if I don't press the clickevent on the second event everything else should trigger as usual.</p>
  
  <p>Thanks for your time</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div id="1"&gt;
       Event 1
       &lt;div id="2"&gt;
           &lt;div id="3"&gt;
              but here is something as well event2
            &lt;/div&gt;
       &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>JavaScript</strong></p>
  
  <pre><code>$("#1").click(function() {
     $(this).slideToggle();
  });
  
  
  $("#3").click(function() {
     $(this).css("background-color", "blue");
  });
  </code></pre>
  
  <p>Fiddle:  <a href="http://jsfiddle.net/VLcxJ/" rel="nofollow">http://jsfiddle.net/VLcxJ/</a></p>