title: Hide parent on child click jquery
body: <blockquote>
    <p><strong>Possible Duplicate:</strong><br>
    <a href="https://stackoverflow.com/questions/12226877/jquery-onclick-hide-its-parent-element">jQuery onclick hide its parent element</a>  </p>
  </blockquote>
  
  
  
  <p>I want to hide <code>&lt;li&gt;</code> when someone click on its child <code>&lt;a&gt;</code>. I used following jQuery code to perform the action but it is not working. Because if someone clicking on <code>&lt;a&gt;</code> that is twitter button it first calling class "<strong>twitter-follow-button</strong>". And it is not going for the jQuery action.
  jQuery Used:</p>
  
  <pre><code>$(document).ready(function(e) {
       $('.twitter-follow-button').click(function() {
              $(this).parent().hide();
       });
  });
  </code></pre>
  
  <p>HTML Used: </p>
  
  <pre><code> &lt;ul&gt;
     &lt;li&gt;
         &lt;div&gt;Something&lt;/div&gt;
         &lt;p&gt;Something&lt;/p&gt;
         &lt;a href="https://twitter.com/'.$uname.'" class="twitter-follow-button"&gt;Follow &lt;/a&gt;
     &lt;/li&gt;
     &lt;li&gt;
         &lt;div&gt;Something&lt;/div&gt;
         &lt;p&gt;Something&lt;/p&gt;
         &lt;a href="https://twitter.com/'.$uname.'" class="twitter-follow-button"&gt;Follow&lt;/a&gt;
     &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>