JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="myList">
    <li class="unselectable">unselectable</li>
    <li>selectable</li>
    <li>selectable</li>
    <li class="unselectable">unselectable</li>
    <li>selectable</li>
</ul>

<button id="theSwitch"> TOGGLE ALL SELECTABLE-NESS </button>

CSS

.unselectable {
   -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;
   -o-user-select: none;
   user-select: none;
   }

JavaScript

$("#theSwitch").click(function(e) {
    //Prevent <button>'s default action
    e.preventDefault();
    
    //toggle all the <li> elements selectable-ness
    $("#myList > li").toggleClass("unselectable");
});