JSFiddle - React, Tailwind, and code Playground

HTML

<form action="" method="post" name="frm1" id="frm1">
    <table>    
        <tr><th>Cause List</th></tr>
        <tr><td><input type="checkbox" name="causelist_month" />Jan</td></tr>
        <tr><td><input type="checkbox" name="causelist_month" />Feb</td></tr>    
        <tr>
            <th>
                <input type="checkbox" name="causelist_month" id="causelist_month" onclick="checkedAll.call(this);"/>select all/unselect all
            </th>
        </tr>  
    </table>
</form>

<form action="" method="post" name="frm2" id="frm2">
    <table>    
        <tr><th>Subscription List</th></tr>
        <tr><td><input type="checkbox" name="subscription_month" />Jan</td></tr>
        <tr><td><input type="checkbox" name="subscription_month" />Feb</td></tr>    
        <tr>
            <th>
                <input type="checkbox" name="subscription_month" id="subscription_month" onclick="checkedAll.call(this);"/>select all/unselect all
            </th>
        </tr>  
    </table>
</form>

JavaScript

function checkedAll() {
    // this refers to the clicked checkbox
    // find all checkboxes inside the checkbox' form
    var elements = this.form.getElementsByTagName('input');
    // iterate and change status
    for (var i = elements.length; i--; ) {
        if (elements[i].type == 'checkbox') {
            elements[i].checked = this.checked;
        }
    }
}