jQuery .nextUntil() Method

Beginner

6 min read

Updated: Oct 2026

5 examples

Live preview

jQuery .nextUntil() method — following siblings until a stop element

Definition

What Is `.nextUntil()`?

.nextUntil([selector|element] [, filter]) (since jQuery 1.4; DOM/jQuery stop since 1.6) returns following siblings up to — but not including — a stop boundary. An optional second filter keeps only matching elements in that range. Returns a new jQuery object; does not change the DOM.

Remember

$("#term-2").nextUntil("dt");              // dd's until next dt
$("#term-1").nextUntil(term3, "dd");       // dd only, stop at DOM node
$("li.start").nextUntil(".end");           // items before .end
$("li.start").nextUntil();                 // same as .nextAll()

// next()      → one sibling
// nextAll()   → all following (no stop)
// nextUntil() → following until stop (exclusive)

Need	Use
Siblings until a stop	`$el.nextUntil(stop)`
All following (no stop)	`.nextAll()`
Immediate next sibling	`.next()`
Backward until a stop	`.prevUntil()`
Filter the range	`.nextUntil(stop, filter)`

Approach

How to Use `.nextUntil()`

Pick a start, choose a stop boundary, optionally filter the range.

Select the starting sibling (e.g. $("#term-2")).
Call .nextUntil("dt") — or pass a DOM node / jQuery object (1.6+).
Optionally add a filter: .nextUntil(stop, "dd").
Remember: the stop element is never in the result.
If the stop is missing, you get the same set as .nextAll().

Piece	Required?	Role
Matched set	Yes	Starting element(s)
Stop (selector / node)	No	Where to stop (exclusive). Omit → like `.nextAll()`
`filter`	No	Keep only matching siblings in the range
Return value	—	New jQuery set (0 or more)

Pseudocode

call $(starts).nextUntil(stop?, filter?)

result = empty set
for each start in the matched set:
    sibling = start.nextElementSibling
    while sibling is not null:
        if sibling matches stop:
            break   // stop itself is NOT added
        if no filter OR sibling matches filter:
            add sibling to result
        sibling = sibling.nextElementSibling

return result as a new jQuery object

Reference

Cheat Sheet

Keep these forward-sibling methods side by side.

Topic	Detail
Syntax	`.nextUntil([stop] [, filter])`
Since	1.4 · DOM stop in 1.6
Includes stop?	No — exclusive boundary
Includes start?	No
vs `.nextAll()`	Bounded range vs all following
vs `.next()`	Range vs one sibling
No stop found	Same as `.nextAll()`
DOM change?	No — query only

Try it

Live Preview

From #term-2 in a definition list, compare .nextUntil(), .nextAll(), and a filtered stop.

From term 2: nextUntil("dt") → three dd's; stop at term 3 is excluded.

Result

Ready — choose a call and click Run.

Code

jQuery Examples

Short, copy-ready snippets. Open DevTools, or use Try It Yourself for a live editor.

Example 1 — Official: `.nextUntil("dt")`

From term 2, mark every sibling until the next term (jQuery API demo).

jQuery

$("#term-2").nextUntil("dt").append(" [until]");

Try It Yourself

How It Works

Start. Select #term-2.
Walk. Collect following siblings one by one.
Stop. Halt when the next dt is reached — do not include it.
Mark. Only the three dd definitions get the suffix.

Example 2 — DOM Stop + `"dd"` Filter

Official idea: stop at a DOM node and keep only dd siblings.

jQuery

var term3 = document.getElementById("term-3");

$("#term-1")
  .nextUntil(term3, "dd")
  .append(" [dd]");

Try It Yourself

How It Works

DOM stop. Pass the raw #term-3 element (since 1.6).
Range. Walk from term 1 until that node.
Filter. Keep only siblings matching "dd".
Skip. dt#term-2 is in the range but filtered out.

Example 3 — `.nextUntil()` vs `.nextAll()`

Same start — bounded range versus every following sibling.

jQuery

$("#u-term-2").nextUntil("dt").append(" [until]");
$("#a-term-2").nextAll().append(" [all]");

Try It Yourself

How It Works

Until. Stops before the next dt.
All. Keeps walking past later terms.
Same start. Both begin at term 2.
Pick. Use nextUntil when you have a clear end marker.

Example 4 — List Items Until `.end`

Mark list items between a start and an end class.

jQuery

$("li.start").nextUntil("li.end").append(" [mid]");

Try It Yourself

How It Works

Start. Select li.start.
Stop. Halt at li.end without including it.
Middle. Only items between start and end are marked.
Use. Handy for steppers and section ranges in a list.

Example 5 — Missing Stop Acts Like `.nextAll()`

If the stop selector never matches, every following sibling is kept.

jQuery

var a = $("li.start").nextUntil(".missing").length;
var b = $("li.start").nextAll().length;

$("#out").text("nextUntil(missing)=" + a + " · nextAll()=" + b);

Try It Yourself

How It Works

Walk. .nextUntil(".missing") looks for a stop that never appears.
Fallback. Official docs: same elements as .nextAll().
Compare. Matching lengths confirm the behavior.
Tip. Double-check your stop selector when results look too large.

Edge Cases & Pitfalls

Why a bounded sibling set can look wrong.

stop

Stop element is never included

Need the boundary too? Select it separately or chain another method.

missing

Missing stop → like `.nextAll()`

A typo in the stop selector silently returns every following sibling.

parent

Only same-parent siblings

The stop must be a following sibling under the same parent — not a nested child.

filter

Filter skips non-matches in range

.nextUntil(stop, "dd") still walks past other tags; it just does not keep them.

Compatibility

Browser Support

.nextUntil() has been part of jQuery since 1.4. Passing a DOM node or jQuery object as the stop was added in 1.6. It works in every browser that runs your loaded jQuery version.

✓ Stable · jQuery 1.4+

jQuery .nextUntil()

Supported across jQuery 1.x (1.4+), 2.x, and 3.x. Prefer a current jQuery 3.x build. Sibling walks use the live DOM tree.

100% With jQuery

Google Chrome All versions · Desktop & Mobile

Full support

Mozilla Firefox All versions · Desktop & Mobile

Full support

Apple Safari All versions · macOS & iOS

Full support

Microsoft Edge All versions · Chromium & Legacy

Full support

Internet Explorer IE 6+ · Legacy environments

Full support

Opera All modern versions

Full support

.nextUntil() Universal

Bottom line: Safe for definition lists, steppers, and “until next section” UI. Confirm the stop selector exists when the set looks too large.

Analysis

Performance Notes

Approach	Cost	Best for
`.next()`	Cheapest	One step forward
`.nextUntil(stop)`	Stops early	Bounded forward range
`.nextAll()`	Linear in all after	Rest of the sibling list

Prefer .nextUntil() when you have a clear end marker — it avoids collecting siblings past the section you care about.

Remember

Key Takeaways

Role: following siblings until a stop — exclusive of the stop.
Stop: selector (1.4+) or DOM/jQuery object (1.6+).
Filter: optional second argument keeps matching siblings only.
Missing stop: same result as .nextAll().

One line: .nextUntil(stop) grabs following siblings up to — but not including — the stop element.

Frequently Asked Questions

What does jQuery .nextUntil() do?

.nextUntil() returns following siblings of each element in the current set, stopping before the first sibling that matches a selector, DOM node, or jQuery object. The stop element itself is never included.

How is .nextUntil() different from .nextAll()?

.nextAll() returns every following sibling with no stop point. .nextUntil(stop) returns siblings only until (but not including) the stop match. If no stop is supplied or never found, .nextUntil() behaves like .nextAll().

Is the stop element included in the result?

No. The element matched by the stop selector, DOM node, or jQuery object is excluded. Only siblings between the start and that boundary are returned.

Can .nextUntil() accept a DOM element as the stop?

Yes, since jQuery 1.6. Pass a DOM node or jQuery object as the first argument — for example nextUntil(document.getElementById("term-3")). Traversal stops before that element.

What is the second filter argument for?

nextUntil(stop, filter) keeps only siblings in the range that also match the filter — useful when mixed sibling types sit between start and stop.

Does .nextUntil() modify the DOM?

No. Like other jQuery traversing methods, it only queries the existing DOM and returns a new collection.

Next: .prev() Method

Get the immediate previous sibling — the reverse of .next().

.prev() tutorial →

About the author

Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

Experience 12 years building web and cloud systems
Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

10 people found this page helpful

jQuery .nextAll() Method jQuery .prev() Method

jQuery .nextUntil() Method

What Is .nextUntil()?

How to Use .nextUntil()

Pseudocode

Cheat Sheet

Live Preview

jQuery Examples

Example 1 — Official: .nextUntil("dt")

How It Works

Example 2 — DOM Stop + "dd" Filter

How It Works

Example 3 — .nextUntil() vs .nextAll()

How It Works

Example 4 — List Items Until .end

How It Works

Example 5 — Missing Stop Acts Like .nextAll()

How It Works

Edge Cases & Pitfalls

Stop element is never included

Missing stop → like .nextAll()

Only same-parent siblings

Filter skips non-matches in range

Browser Support

jQuery .nextUntil()

Performance Notes

Key Takeaways

Frequently Asked Questions

Related Topics

.nextAll()

.next()

.prevUntil()

.prev()

.siblings()

Traversing hub

Next: .prev() Method

About the author

What Is `.nextUntil()`?

How to Use `.nextUntil()`

Example 1 — Official: `.nextUntil("dt")`

Example 2 — DOM Stop + `"dd"` Filter

Example 3 — `.nextUntil()` vs `.nextAll()`

Example 4 — List Items Until `.end`

Example 5 — Missing Stop Acts Like `.nextAll()`

Missing stop → like `.nextAll()`