JSFiddle - React, Tailwind, and code Playground

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

function CheckAllCheckboxes(current) {
    var state = $(current).is(":checked");
    alert(state);
    if (state === false) {
        $('input[type="checkbox"]').removeAttr("checked");
    } else {
        alert($('input[type="checkbox"]').length);
        for (var i=1;i < $('input[type="checkbox"]').length;i++)
        {
            $("#check" + i).attr('checked',true);
        }
    }
}
$(document).ready(function(){
    $("#checkAll").click(function(){
        CheckAllCheckboxes(this);
    });
});