jQuery Document Manipulation - wrap() Method

jQuery Effect Reference Manual

Example

Wrap each paragraph inside a <div> element:

$(".btn1").click(function(){
   $("p").wrap("<div></div>");
});

Try it yourself

Definition and Usage

The wrap() method places each selected element inside the specified HTML content or element.

Syntax

$().wrap(wrapper)
Parameters Description
wrapper

Required. Specifies the content to wrap around the selected elements.

Possible values:

  • HTML code - for example ("<div></div>")
  • New element - for example (document.createElement("div"))
  • Existing elements - for example ($(".div1"))

Existing elements will not be moved, only copied and wrapped around the selected elements.

Use a function to wrap elements

Use a function to specify the content wrapped around each selected element.

Syntax

$().wrap(function())

Try it yourself

Parameters Description
function() Required. Specifies the function that returns the wrapping element.

More examples

Use the new element to wrap
Create a new DOM element to wrap each selected element.
Wrap or unwrap elements
Toggle between wrapping and unwrapping elements.

jQuery Effect Reference Manual