JSFiddle - React, Tailwind, and code Playground

by cmruser

HTML

<ul>
    <li>It is said that
        <ul>
            <li>It is said that</li>
            <li>your life flashes before</li>
            <li>your eyes just before you die.</li>
            <li>That is true, it's called Life.</li>
        </ul>    
    </li>
    <li>your life flashes before</li>
    <li>your eyes just before you die.</li>
    <li>That is true, it's called Life.</li>
</ul>

CSS

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

body {
 padding: 100px;   
}
li {
  -moz-user-select: none;  

}
.selected {
 border:1px solid red;
}

JavaScript

$(document).ready(function() {

    $("li").on('click', function(e) {
        e.preventDefault();
        e.stopPropagation();
        
        if(e.ctrlKey) {
              $(this).toggleClass('selected');  
        } else {
              $("li").removeClass("selected");
              $(this).addClass("selected");           
        }
    });
});