JSFiddle - React, Tailwind, and code Playground

by markm

HTML

<p>
    <a id="toggle" href="#">Toggle - Style</a>
</p>

<ul id="Thelist" class='category-static-links'>
    <li><a href='#'>Blackjack</a> </li>
    <li><a href='#'>Craps</a> </li>
    <li><a href='#'>Poker</a></li>
    <li><a href='#'>Roulette</a> </li>
    <li><a href='#'>Slots</a></li>
</ul>

CSS

ul { list-style-type: none;}

li a {
    text-decoration:none;
    color:#3a3a55;
}

.category-static-links-block li{
    display:inline-block;
    border-right:1px solid #3a3a55;
    padding-right:.5em;
    padding-left:.5em;    
}

.category-static-links-block  li:last-child { border-right: none; }

JavaScript

$("#toggle").click(function(){
    $("#Thelist").toggleClass("category-static-links-block");
   
});