CODEWITHSUNDEEP
javascriptjqueryhtml
user2395238
user2395238

Reputation: 900

How to create a child div that would wrap around all other child divs

I have this html structure:

<div class="a">
    <div class="b"></div>
    <div class="c"></div>
    <div class="d"></div>
</div>

How can would I use jquery to add child div to div "a" that would wrap around "b", "c" and "d"? Basically, the final html I want should look like this:

<div class="a">
    <div class="child">
        <div class="b"></div>
        <div class="c"></div>
        <div class="d"></div>
    </div>
</div>

Thanks

Upvotes: 3

Views: 66

Answers (4)

Milind Anantwar
Milind Anantwar

Reputation: 82251

use .wrapInner()

$('.a').wrapInner('<div class="test"></div>')

Working Demo

or

use .wrapAll():

 $('.a div').wrapAll('<div class="child"></div>')

Working Demo

Upvotes: 0

Kiran
Kiran

Reputation: 20293

Try this:

$(function() {
   $('.a > div').wrapAll('<div class="child"></div>');
});

Upvotes: 1

Deepu--Java
Deepu--Java

Reputation: 3840

$('.a').html('<div class="child">'+$('.a').html()+'</div>');

Upvotes: 0

Rajaprabhu Aravindasamy
Rajaprabhu Aravindasamy

Reputation: 67217

Try,

$('.a > div').wrapAll($('<div/>',{'class' : 'child'}));

DEMO

Upvotes: 4

Related Questions