title: JQuery Click inside div
body: <p>I am trying to add a click event on a div thats inside a li that already has a click event. I don't want the li click event to fire when the div click event is fired. </p>
  
  <p>Here is the jsfiddle of what I am trying to do.  <a href="http://jsfiddle.net/2srUd/5/" rel="nofollow noreferrer">http://jsfiddle.net/2srUd/5/</a></p>
  
  <p>When I click on the .inside I don't want the #outside click to fire. I assume I need to ad a not to the selector $(".inside") </p>
  
  <pre><code>&lt;script&gt;
      $(document).ready(function() {
  
          $("#outside").click(function() {
              alert("outside click");
          });
  
          $(".inside").click(function() {
              alert("inside click");
          });
  
      });
  &lt;/script&gt;
  &lt;ul&gt;
      &lt;li id="outside" style="border:2px solid red; padding:20px;"&gt;
          &lt;div class="inside" style="border:2px solid blue; "&gt;Click This Div. I want to accept the inside click but not the outside click.&lt;/div&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>