jQuery wrap every X elements in div

Question

I have a list of elements (divs) preseded by a H3 tag

<         


        

Answer 1

I've ended up with this and it's working

$(function(){
    var h3=$('h3');
    h3.each(function(){
        var divs=$(this).nextUntil('h3');
        var row_wreapper=$('
');
        while(divs.length)
        {
            var grp=divs.splice(0, 3);
            var row=$('
');
            $(grp).each(function(){
                row.append($(this));
            });
            row_wreapper.append(row);
        }
        $(this).after(row_wreapper.html());
    });
});​

DEMO or with a little extra checking of item class DEMO.

Or

$(function(){
    var h3=$('h3');
    h3.each(function(){
    var divs=$(this).nextUntil('h3');
    var row_wreapper=$('
');
    while(divs.length)
    {
        var grp=divs.splice(0, 3);
        var row=$(grp).wrapAll('
');
        if(row.children().length) row_wreapper.append(row);
    }
    $(this).after(row_wreapper.html());
    });
});​

DEMO.