title: Hide div on blur
body: <p>I have a jQuery function where when an element is clicked a hidden div shows. </p>
  
  <pre><code>$('.openHide').click(function(){
      $(this).next('.hiddenContent').toggle();
  });
  </code></pre>
  
  <p>I need to modify it s that I could close this div if I click back not just on the first element. Possibly on Blur, but I am not sure how to indicate the element...</p>
  
  <pre><code>$('.hiddenContent').blur(function() {
      $('.hiddenContent').parent().children('.hiddenContent').hide();
  });
  </code></pre>
  
  <p>Here's my HTML:</p>
  
  <pre><code>&lt;span class="openHide"&gt;text here&lt;/span&gt;
  &lt;div style="display:none" class="hiddenContent"&gt;
       hidden content here
  &lt;/div&gt;
  </code></pre>