Konrad
Konrad

Reputation: 941

How to wrap elements when having their parent element?

I have the following structure:

<div class='wrap1'>
 <div class='element1'></div>
 <div class='element2'></div>
</div>

Now I'd like to get:

<div class='wrap1'>
 <div class='anotherWrap'><!-- this is new-->
  <div class='element1'></div>
  <div class='element2'></div>
 </div>
</div>

That is, I need to wrap element1 and element2 in anotherWrap.

I tried:

$('.wrap1').children().wrapAll("<div class='anotherWrap'></div>")

But, as I expected, this wrapped every sub div in my wrap1 div separately.

How to accomplish this?

Upvotes: 4

Views: 243

Answers (4)

Mohd. Shaukat Ali
Mohd. Shaukat Ali

Reputation: 752

I was also trying to do but didn't find any solution. I used the following work around. Hope this will work for you..

$('.wrap1').prepend("<div class='anotherWrap'>").append("</div>");

Upvotes: 2

loveNoHate
loveNoHate

Reputation: 1547

3rd use .contents():

$('.wrap1').contents().wrapAll("<div class='anotherWrap'></div>");

JSFIDDLE: http://jsfiddle.net/4tbtoga2/.

Upvotes: 1

Rajaprabhu Aravindasamy
Rajaprabhu Aravindasamy

Reputation: 67217

Use .wrapInner() over the parent element,

$('.wrap1').wrapInner("<div class='new' />");

DEMO

Upvotes: 8

Milind Anantwar
Milind Anantwar

Reputation: 82251

Use:

$( ".element1,.element2" ).wrapAll( "<div class='anotherWrap'></div>");

Working Demo

Upvotes: 1

Related Questions