title: jQuery click() on a nested div
body: <p>The code can probably explain this better than I can:</p>
  
  <pre><code>&lt;div class="wrapper"&gt;
      &lt;div class="inner1"&gt;&lt;/div&gt;
      &lt;div class="inner2"&gt;&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;script&gt;
  $('div').click(function(){
      var class_name = $(this).attr('class');
      do_something(class_name);
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>When I click on the <code>inner1</code> div, it runs the <code>do_something()</code> with both the <code>inner1</code> div AND the <code>wrapper</code>.  </p>
  
  <p>With the site being built, nested divs are going to happen a lot. Is there a dynamic way to fix this issue and only run the top level div (in this case <code>inner1</code>)?</p>