jQuery Untils: nextUntil, prevUntil, parentsUntil


jQuery Untils provides three very simple, but very useful methods: nextUntil, prevUntil, and parentsUntil. These methods are based on their nextAll, prevAll, and parents counterparts, except that they allow you to stop when a certain selector is reached. Elements are returned in “traversal order”.

As of jQuery 1.4, these methods are now included in jQuery core! See the patch as well as the official documentation on the .prevUntil, .nextUntil and .parentsUntil methods.

Note that these methods take a less naïve approach than others bearing the same names, and are designed to actually return elements in traversal order, despite the element ordering flaws inherent in the jQuery 1.3.2 selector engine.

Basic usage

// Select all list items between the first and last.
$("ul > :first").nextUntil( ":last" );

// The same elements, in the opposite order.
$("ul > :last").prevUntil( ":first" );

// Select all "div" elements between .foo and .bar
$(".foo").nextUntil( ".bar", "div" );

// Select all parent elements, excluding body and html.
$(".foo").parentsUntil( "body" );

Advanced usage

This is not rocket science. There really is no “advanced” usage!

But, seriously

This plugin is going to do exactly what you expect, except that it takes care of some general jQuery 1.3.2 selector issues when there are multiple elements in the initial selector. This might be an edge-case, but it exists nonetheless.

Just take a look at the nextUntil, prevUntil and parentsUntil examples to see what’s going on.

If you have any non-bug-related feedback or suggestions, please let me know below in the comments, and if you have any bug reports, please report them in the issues tracker, thanks!

Post A Comment

  • Any of these HTML tags may be used for style: a, b, i, br, p, strong, em, pre, code.
  • Multi-line JavaScript code should be wrapped in <pre class="brush:js"></pre>
    (supported syntax highlighting brushes: js, css, php, plain, bash, ruby, html, xml)
  • Use &lt; instead of < and &gt; instead of > in the examples themselves.