JSFiddle - React, Tailwind, and code Playground

by Nick Craver

HTML

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/dot-luv/jquery-ui.css">
<script src="http://www.arongalabuzi.co.uk/stuff/fb/fcbklistselection.min.js"></script>
<link rel="stylesheet" href="http://www.arongalabuzi.co.uk/stuff/fb/fcbklistselection.css">
<h1>fcbkListSelection demo</h1> 
<form action="test.php" method="post"> 
<ul id="fcbklist"> 
    <li>        
        <strong>Manuel Mujica Lainez</strong><br /> 
        <span class="fcbkitem_text">auto complete &amp; pre added values.</span> 
        <input type="checkbox" name="fcbklist_value[]" class="contactvalues" value="info@manuel.com" id="manuel" />      
    </li> 
    <li>        
        <strong>Gustavo Nielsen</strong><br /> 
        <span class="fcbkitem_text">If you have any comments or requests, please post them and</span> 
        <input type="checkbox" name="fcbklist_value[]" class="contactvalues" value="info@gustavo.com" id="gustavo" />         
    </li> 
    <li>        
        <strong>Silvina Ocampo</strong><br /> 
        <span class="fcbkitem_text">auto complete &amp; pre added values.</span> 
        <input type="checkbox" name="fcbklist_value[]" class="contactvalues" value="info@silvina.com" id="silvina" /> 
               
    </li> 
    <li>       
        <strong>Antonio Porchia</strong><br /> 
        <span class="fcbkitem_text">auto complete &amp; pre added values. If you</span> 
        <input type="checkbox" name="fcbklist_value[]" class="contactvalues" value="info@antonio.com" id="antonio" />       
    </li> 
    <li> 
        <strong>Gustavo Nielsen</strong><br /> 
        <span class="fcbkitem_text">If you have any comments or requests, please post them and</span> 
        <input type="checkbox" name="fcbklist_value[]" class="contactvalues" value="info@nielson.com" id="nielson" />         
    </li> 
    <li onclick="$('#ocampo').attr('checked',!$('#ocampo').attr('checked'));"> 
        <strong>Haunter250</strong><br /> 
        <span...

JavaScript

$.fcbkListSelection("#fcbklist","400","50","2");
$("#selectAll").change(function() {
  $("#fcbklist li input:checkbox").attr("checked", this.checked).parent().trigger('click');
});