JSFiddle - React, Tailwind, and code Playground

by j08691

HTML

<ul class="field">
             
                  <li>
                       <span>
                           Test A 
                       <label for="id_check1">Check 1</label>: <input checked="checked" type="checkbox" value="1" id="id_check1"></span>
              
                  </li>
             
               
    
                      <li>
                       <span>
                           Test B
                       <label for="id_check2">Check 2</label>: <input checked="checked" type="checkbox" value="2" id="id_check2"></span>
                   
                  </li>
    
                          <li><div style="position:absolute; left:0; right:0; top:0; bottom:0;"></div>
                       <span>
                           Test D
                       <label for="id_check3">Check 3</label>: <input checked="checked" type="checkbox" value="3" id="id_check3"disabled="disabled"></span>
                   
                  </li>
</ul>

CSS

span {
 background:red;   
}

JavaScript

$('li').on('click', 'div', function(event){ 
         alert('clicked');
         event.preventDefault();
             }
             
);