JSFiddle - React, Tailwind, and code Playground

by chiragvidani

HTML

<table>
    <tr>
        <th scope="row">
            <input type="checkbox" id="checkAll">
        </th>
        <tr>
            <td>
                <input type="checkbox" id="check1">
            </td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" id="check2">
            </td>
        </tr>
        <tr>
            <td>
                <input type="checkbox" id="check3">
            </td>
        </tr>
</table>

JavaScript

$(':checkbox').not('#checkAll').change(function () {
    $("#checkAll").attr("checked", $(":checkbox").not(":checked").not("#checkAll").length ? false : true);
});
$("#checkAll").change(function () {
    $(':checkbox').attr('checked', this.checked);
});