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');
});