Wrap deferents html tags with div using jQuery

Question

I have the following lines in HTML :

<header class="title">
    <h3>Billing Address</h3>
</header>

<address>
 <p>Address</p>
</address>

And I would like to wrap them between the new divwith jQuery, because I don't have access to HTML.

If I use .before()and .after(), it does not work

$('header').before('<div="new-div">');
$('address').after('</div>');

I tried with .wrap()and .append(), but also does not work.

Result:

<div class="new-div">
    <header class="title">
        <h3>Billing Address</h3>
    </header>

    <address>
     <p> Address </p>
    </address>
</div>

Thank!

Answer 1

Use .wrapAll()instead .wrap():

wrapAll: wrap an HTML structure around all elements in a set of consistent elements.

$( "header,address" ).wrapAll( "<div class='new' />");

Working demo

Answer 2

prepend() append()

$('header').prepend('<div="new-div">');
$('address').append('MYDIV</div>');