Wrapping Multiple Elements (jQuery)

dom, jquery

Solution

I would do it in one line to minimize lookup:

$('content')
     .before('<div class="top"></div>')
     .after('<div class="bottom"></div>')
     .wrap('<div class="wrapper"></div>');

Problem

I've this piece of HTML: ``` div.content div.one content div.two content div.three content ``` I want to add two divs on top and bottom and wrap one div around it so it becomes: ``` div.top div.wrapper div.content div.one content div.two content div.three content div.bottom ``` I'm aware of the several wrap selectors (innerWrap, wrapAll etc..) but I'm not sure how to wrap 2 divs. The following jQuery might work, but is there a better way to write it? ``` $('content').wrap('<div class="wrapper"></div'); $('.wrapper').before('<div class="top"></div>'); $('.wrapper').after('<div class="bottom"></div>'); ```

Original source