JSFiddle - React, Tailwind, and code Playground

by dustinpoissant

HTML

<ul>
    <li>List 1 Item 1</li>
    <li>List 1 Item 2</li>
    <li>List 1 Item 3</li>
    <li>List 2 Item 1</li>
    <li>List 2 Item 2</li>
    <li>List 2 Item 3</li>
    <li>List 3 Item 1</li>
    <li>List 3 Item 2</li>
    <li>List 3 Item 3</li>
</ul>

CSS

ul li {
    display: inline-block;
}

JavaScript

(function ($) {
    $.fn.wrapN = function (wrapper, n, start) {
        if (wrapper === undefined || n === undefined) return false;
        if (start === undefined) start = 0;
        for (var i = start; i < $(this).size(); i += n) {
            $(this).slide(i, i+n).wrapAll(wrapper);
        }
        return this;
    }
}(jQuery));