.unwrap()?.unwrap() removes the parent of each matched element and leaves those elements in the DOM where the parent was (since jQuery 1.4). It is the inverse of .wrap(). Returns the same jQuery set for chaining.
$(els).unwrap() // remove immediate parent
$(els).unwrap(".wrapper") // jQuery 3.0+ — only if parent matches
Before: <div><p>Hi</p></div>
After: <p>Hi</p>
siblings move up with the matched elements
≠ .remove() (remove deletes the matched els)| Need | Use |
|---|---|
| Strip one parent layer | $(els).unwrap() |
| Unwrap only matching parents | $(els).unwrap(".box") (3.0+) |
| Add a parent around each | $(els).wrap("<div>") |
| Delete the matched elements | $(els).remove() |
.unwrap()Select the inner elements, then unwrap their parents.
$("p"), $(".item")..unwrap() with no args, or pass a selector (jQuery 3.0+) to filter parents.| Piece | Required? | Role |
|---|---|---|
| jQuery set | Yes | Elements whose parent will be removed |
selector | No (3.0+) | Unwrap only if parent matches |
| Return | — | Same matched set (chainable) |
| Since | — | 1.4; selector in 3.0 |
unwrap(optionalSelector):
for each element in this set:
parent = element.parent
if optionalSelector and parent does not match:
skip
else:
move parent's children into parent's place
remove parent from the DOM
return this setKeep these facts handy when stripping wrappers.
| Topic | Detail |
|---|---|
| Syntax | .unwrap([selector]) |
| Removes | Immediate parent (not the matched els) |
| Keeps | Matched elements + their siblings |
| Inverse | .wrap() |
| Selector | jQuery 3.0+ only |
| Returns | Original matched set |
| Since | jQuery 1.4 |
Run unwrap on a small HTML sketch and watch the parent disappear.
Short, copy-ready snippets. Open DevTools Console, or use Try It Yourself for a live editor.
.unwrap()Remove the parent div and keep the paragraph.
$("#msg").unwrap();
console.log($("#host").html());
// <p id="msg">Hello</p><div><p id="msg">Hello</p></div>.$("#msg") targets the paragraph.div is removed.#host.Official idea: wrap each paragraph, then unwrap on the next click.
var $p = $("p.demo");
if ($p.parent().is("div") && !$p.parent().is("#host")) {
$p.unwrap();
} else {
$p.wrap("<div>");
}
console.log($("#host").html());.unwrap() to strip each parent div..wrap("<div>") wraps each paragraph.Unwrap only when the parent matches a selector.
$("#a").unwrap(".box"); // parent matches → unwrapped
$("#b").unwrap(".box"); // parent is <section> → skipped
console.log($("#host").html());#a sits in div.box — selector matches → unwrap.#b sits in section — selector fails → stay wrapped.Unwrapping promotes every child of the parent, not only the matched one.
$("#keep").unwrap();
console.log($("#host").html());
// <p id="keep">Keep</p><span>Sibling</span>#keep and a sibling span.#keep is selected..unwrap() vs .remove()Unwrap keeps the element; remove deletes it.
$("#u").unwrap(); // keeps #u, removes its parent
$("#r").remove(); // deletes #r
console.log($("#host").html());
// <p id="u">Unwrap me</p>#u is removed; #u stays.#r (and its wrapper content) is deleted from the DOM.Check these before stripping wrappers in production.
.unwrap() removes one layer. Nested wrappers need multiple calls (or a loop).
Unwrapping when the parent is body / document root is usually wrong — keep a sensible container.
On 1.x/2.x, pass no argument. Check the parent yourself with .parent().is(...) if needed.
All children of the removed parent are promoted — not only the matched element.
.unwrap() needs jQuery 1.4+. The optional selector argument needs jQuery 3.0+.
Works in Chrome, Firefox, Safari, and Edge when jQuery 1.4+ is loaded. Use 3.0+ for .unwrap(selector).
Bottom line: Safe for modern jQuery. Prefer a selector (3.0+) when only specific parent wrappers should be removed.
| Approach | Cost | Best for |
|---|---|---|
.unwrap() | DOM move + remove parent | Strip one wrapper layer |
.unwrap(sel) | Same + parent match test | Selective unwrap (3.0+) |
| Repeated unwrap in a loop | Cost × layers | Deep nested wrappers |
Cost scales with how many parents you remove. Prefer one clear unwrap over many accidental calls in hot paths.
.wrap() to add / strip wrappers.One line: .unwrap() strips the parent wrapper and leaves the matched elements in place.
Learn how to add a parent wrapper around each matched element.
9 people found this page helpful