jQuery Tutorial

DOM Manipulation Methods for Adding Elements (Around an Element)

jQuery unwrap() Method

The unwrap() method removes the selected elements' parent elements.

Syntax of unwrap method in jQuery

$(selector).unwrap()

Example of jQuery unwrap method

Remove all

elements' parent elements:

$("button").click(function(){
$("p").unwrap();
});

jQuery wrap() Method

Wraps specified HTML element(s) around each selected element with the wrap() method.

Syntax of wrap method in jQuery

$(selector).wrap(wrappingElement,function(index))

Example of jQuery Wrap method

Wrap each

element in a

element:
$("button").click(function(){
$("p").wrap("
");
});

jQuery wrapAll() Method

Wraps specified HTML elements around all selected elements with the wrapAll() method.

Syntax of wrapAll method in jQuery

$(selector).wrapAll(wrappingElement)

Example of jQuery wrapAll method

Wrap all

elements in a

element:
$("button").click(function(){
$("p").wrapAll("
");
});

jQuery wrapInner() Method

The wrapInner() method wraps the content (innerHTML) of each selected element around the specified HTML element(s).

Syntax of wrapInner method in jQuery

$(selector).wrapInner(wrappingElement,function(index))

Example of jQuery wrapInner method

Wrap a element around each

element's content:

$("button").click(function(){
$("p").wrapInner("");
});
Did you find this article helpful?