Dev01
Dev01

Reputation: 14129

jQuery, wrap all consecutive elements?

With jQuery, is there a version of wrapAll that will wrap all consecutive elements? Like this:

<h2>bar</h2>
<h2>bar</h2>
<p>foo</p>
<p>foo</p>
<h2>bar</h2>
<p>foo</p>
<h2>bar</h2>

turns into this:

<h2>bar</h2>
<h2>bar</h2>
<div>
    <p>foo</p>
    <p>foo</p>
    <h2>bar</h2>
    <p>foo</p>
</div>
<h2>bar</h2>

Or even more complicated, with nested

:

<h2>bar</h2>
<h2>bar</h2>
<span>
    <p>foo</p>
    <p>foo</p>
</span>
<h2>bar</h2>
<p>foo</p>
<h2>bar</h2>
<span>
    <p>foo</p>
</span>
<h2>bar</h2>

turns into this:

<h2>bar</h2>
<h2>bar</h2>
<div>
    <span>
       <p>foo</p>
       <p>foo</p>
    </span>
    <h2>bar</h2>
    <p>foo</p>
    <h2>bar</h2>
    <span>
        <p>foo</p>
    </span>
</div>
<h2>bar</h2>

When this is run?

$('p').wrapAll2('<div />')

Upvotes: 2

Views: 380

Answers (1)

Kane Cohen
Kane Cohen

Reputation: 1800

As far as i know there's no such function, but you could write it yourself. On the first glance doesn't seem to be too difficult.

You'd have to go through all 'p' (or whatever you wan to wrap) elements on the page, find first one and then it's last parent then last one and it's last parent, then take all elements between, including first and last parents and wrap them into desired tag.

Upvotes: 1

Related Questions