JSFiddle - React, Tailwind, and code Playground

by Kiran Reddy

HTML

<h2>Checkbox Test</h2>
<form name="form1" method="post" action="">
    <p>
        <label>
            <input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_0">
            Checkbox</label>
        <br>
        <label>
            <input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_1">
            Checkbox</label>
        <br>
    </p>
</form>
<p><span id="chkAll">Check All</span> / <span id="unChkAll">Uncheck all</span></p>

CSS

span {
    text-decoration: underline;
    cursor: pointer;
}

JavaScript

$('document').ready(function() {
        $('#chkAll').click(function() {
            $('input[type="checkbox"]').prop('checked', true);
        });
        $('#unChkAll').click(function() {
            $('input[type="checkbox"]').prop('checked', false);
        });
    });