JSFiddle - React, Tailwind, and code Playground

by AndyE

HTML

<div class="quoteWrapper">
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
    <div class="quote"></div>
</div>

CSS

.quoteWrapper { background-color: green; }
.quote { height: 16px; }
.sixQuoteWrapper { background-color: red; margin: 2px; }

JavaScript

var i = 0, 
    quotes = $("div.quoteWrapper").children(),
    group;

while ((group = quotes.slice(i, i += 6)).length) {
    group.wrapAll('<div class="sixQuoteWrapper"></div>');
}