JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.7/css/jquery.dataTables.min.css">
<script src="https://cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
<table id="eventsTable" class="table table-striped table-bordered" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Name</th>
            <th>Checkbox
                <input type="checkbox" id="checkall" />
            </th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Tiger Nixon</td>
            <td>
                <input type="checkbox" id="checkbox1" />
            </td>
        </tr>
        <tr>
            <td>Garrett Winters</td>
            <td>
                <input type="checkbox" id="checkbox2" />
            </td>
        </tr>
        <tr>
            <td>Ashton Cox</td>
            <td>
                <input type="checkbox" id="checkbox3" />
            </td>
        </tr>
        <tr>
            <td>Cedric Kelly</td>
            <td>
                <input type="checkbox" id="checkbox4" />
            </td>
        </tr>
        <tr>
            <td>Airi Satou</td>
            <td>
                <input type="checkbox" id="checkbox5" />
            </td>
        </tr>
        <tr>
            <td>Brielle Williamson</td>
            <td>
                <input type="checkbox" id="checkbox6" />
            </td>
        </tr>
        <tr>
            <td>Herrod Chandler</td>
            <td>
                <input type="checkbox" id="checkbox7" />
            </td>
        </tr>
        <tr>
            <td>Rhona Davidson</td>
            <td>
                <input type="checkbox" id="checkbox8" />
            </td>
        </tr>
        <tr>
            <td>Colleen Hurst</td>
            <td>
                <input type="checkbox" id="checkbox9" />
            </td>
        </tr>
        <tr>
            <td>Sonya Frost</td>
            <td>
                <input type="checkbox" id="checkbox10" />
            </td>
    ...

JavaScript

$(document).ready(function () {
    $.extend($.fn.dataTable.defaults, {
        "columns": [null, {
            "orderable": false
        }]
    });
    $('#eventsTable').DataTable();
});

$("#checkall").on('click', function () {
    if (this.checked) {
        for (var i = 1; i <= 12; i++) {
            var id = "#checkbox" + i;
            $(id).prop('checked', true);
        }
    } else {
        for (var i = 1; i <= 12; i++) {
            var id = "#checkbox" + i;
            $(id).prop('checked', false);
        }
    }
});