JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" value="Switch Style" />
<ul>
    <li>5/1</li>
    <li>A</li>
    <li>B</li>
</ul>
<ul>
    <li>5/2</li>
    <li>C</li>
    <li>F</li>
    <li>J</li>
</ul>
<ul>
    <li>5/3</li>
    <li>D</li>
    <li>G</li>
    <li>K</li>
    <li>L</li>
</ul>
<ul>
    <li>5/4</li>
    <li>D</li>
    <li>H</li>
</ul>
<ul>
    <li>5/5</li>
    <li>E</li>
    <li>I</li>
</ul>

CSS

li {
    list-style: none;
}

.style1 {
    float: left;
}

.style2 > li {
    display: inline-block;
}

JavaScript

var $ul = $('ul').addClass('style1');
$('input:button').click(function () {
    $ul.toggleClass('style1 style2');
});