CODEWITHSUNDEEP
javascriptjquery
user1355300
user1355300

Reputation: 4987

wrap multiple <p> in a div with jQuery

In the following markup there are two <p> tags. How can I wrap both of them in a single div using jQuery?

<div class="box">
    <ul>
        <li>1</li>
        <li>1</li>
    </ul>
    <p>paragraph 1</p>
    <p>paragraph 2</p>
</div>

Desired output should be:

<div class="wrap">
    <p>paragraph 1</p>
    <p>paragraph 2</p>
</div>

I have been trying jQuery function .wrap, but failed to do so. I could only try following but it would wrap both <p> in separate <div>:

$( "p" ).wrap( "<div class='wrap'></div>" );

JSFiddle: http://jsfiddle.net/avfr8fpe/

Upvotes: 0

Views: 99

Answers (1)

CodingIntrigue
CodingIntrigue

Reputation: 78565

You can use wrapAll:

$( "p" ).wrapAll( "<div class='wrap'></div>" );

Updated jsFiddle

Upvotes: 7

Related Questions