Question

I have the following html :

<div class="backpack_all"> //wrapper for all on screen content
    ...
    <div class="backpack"> //main content to display
        <div class="item1">
        <div class="item2">
        <div class="item3">
        ...etc

I will have anywhere from 200-500 items in this format. I’m also actively sorting this data by various attributes on these items. When unsorted, they are partitioned in sets of 50 by a class=”backpack_partition” which wraps around 50 items. To sort them I have to unwrap all items from their respective partitions. How can I use jquery/javascript to rewrap them?

Answer 1

Resorted to some good old fashioned JS.

var divs = $('.backpack > .item');
for(var i = 0; i < divs.length; i+=50) {
    divs.slice(i, i+50).wrapAll("<div class='backpack_partition'></div>");
}