JSFiddle - React, Tailwind, and code Playground

HTML

<ul id='menu'>
    <li>Blah</li>
    <li>blah</li>
</ul>
<p id='switcherContainer'>
    <button class='switcher' data-style=1>Switch to style1</button>
    <button class='switcher' data-style=2>Switch to style2</button>
</p>

CSS

#menu.style1 {
    background : #aaa;
}
#menu.style1 li {
    color : green;
}

#menu.style2 {
    background : #777;
}
#menu.style2 li {
    color : orange;
}

JavaScript

document.getElementById( 'switcherContainer' ).addEventListener( 'click', function ( e ) {
    var target = e.target;
    if ( !target.classList.contains('switcher') ) {
        return;
    }
    
    document.getElementById( 'menu' ).className = 'style' + target.getAttribute( 'data-style' );
});