title: Using next() with block elements in between
body: <p>I'm trying to use jQuery's <code>next()</code> to grab the very next paragraph of the selected element, but because there is a div in the way, it seems as though next will not work.  What selector should I be using instead?</p>
  
  <p>Works :</p>
  
  <pre><code>&lt;div&gt;
     &lt;span class="clickme"&gt;A name here&lt;/span&gt;
     &lt;p class="showme" style="display:none;"&gt;Here's some text! &lt;/p&gt;
  &lt;/div&gt;
  $('.clickme').click(function() {
     $(this).next('.showme').slideDown();
  });
  </code></pre>
  
  <p>Does not work :</p>
  
  <pre><code>&lt;div&gt;
     &lt;span class="clickme"&gt;A name here&lt;/span&gt;
     &lt;div&gt;&lt;/div&gt;
     &lt;p class="showme" style="display:none;"&gt;Here's some text! &lt;/p&gt;
  &lt;/div&gt;
  $('.clickme').click(function() {
     $(this).next('.showme').slideDown();
  });
  </code></pre>
  
  <p>Why does this occur?  Does <code>next()</code> with a specified class not go beyond the very next block element?  Is that why this is happening?  Is there a selector that specify the very 'next' class with <code>showme</code> should be selected?</p>
  
  <p>Fiddle - <a href="http://jsfiddle.net/QespX/" rel="nofollow">http://jsfiddle.net/QespX/</a></p>