title: Can't hide element on click for some reason
body: <p>I have an element on my website, it looks like so:</p>
  
  <pre><code>&lt;div class="nw_help"&gt;&lt;div class="nw_help_content"&gt;...&lt;/div&gt;&lt;/div&gt;
  </code></pre>
  
  <p>Easy stuff. Using CSS on nw_help:hover, nw_help_content becomes visible. In order to support touchscreens too, I have written the following:</p>
  
  <pre><code>$(document).ready(function() {
      $('.nw_help').click(function() {
          $(this).find(".nw_help_content").css('visibility', 'visible');
      });
  });
  $(document).ready(function() {
      $('.nw_help_content').click(function() {
          $(this).css('visibility', 'hidden');
      });
  });
  </code></pre>
  
  <p>The first function works flawlessly, the second one doesn't wanna work at all. I've checked if $('.nw_help_content').css('visibility', 'hidden'); is working in browser's console and it is.</p>
  
  <p>Any ideas?</p>
  
  <p>Thanks so much in advance for your answer.</p>
  
  <p>Edit: Now it hit me: the first function is triggered on clicking nw_help_content as well and it "neutralizes" the second function. But how to prevent it?</p>