JSFiddle - React, Tailwind, and code Playground

by karim79

HTML

<p class="list">
    <label><input type="checkbox" checked  name="chkday" id="chkday0" value="0" />All days</label>
    <label><input type="checkbox"  name="chkday" id="chkday1" value="1"  />Sunday</label>
    <label><input type="checkbox"  name="chkday" id="chkday2" value="2" />Monday</label>
    <label><input type="checkbox"  name="chkday" id="chkday3" value="3" />Tuesday</label>
    <label><input type="checkbox"  name="chkday" id="chkday4" value="4"  />Wednesday</label>
    <label><input type="checkbox"  name="chkday" id="chkday5" value="5" />Thursday</label>
    <label><input type="checkbox"  name="chkday" id="chkday6" value="6" />Friday</label>
    <label><input type="checkbox"  name="chkday" id="chkday7" value="7"  />Saturday</label>
</p>

JavaScript

$("input:checkbox").change(function() {
         if($(this).val() == "0" && this.checked) {
             $("input:checkbox").attr('checked', true);
         } else if($(this).val() == "0" &&!this.checked) {
         $("input:checkbox").attr('checked', false);
         
         } else {
             $("input:checkbox").attr('checked', false);
             $(this).attr('checked', true);
         }
    });