JSFiddle - React, Tailwind, and code Playground

by Kheema Pandey

HTML

<ul id="tm-menu" class="tm-menu menu">
  <li>Option 1</li>
  <li>Option 2</li>
  <li>Option 3</li>
  <li>Option 4</li>
  <li>Option 5</li>
</ul>
  <button value="Hitme">Hit Me</button>

CSS

.tm-menu
{
font-size:120%;
color:red;
  background-color:aqua;
}
.newclass
{
font-size:120%;
color:green;
  background-color:yellow;
}

JavaScript

/*Switch the classes on Button click*/
$("button").click(function(){
 $( "ul.menu" ).toggleClass("tm-menu, newclass");
}); 


/*Add or Remove the Class on Click*/
$("button").click(function(){
 $( "ul.menu" ).removeClass( "tm-menu" ).addClass( "newclass" );
});