Check all checkboxes in asp.net Gridview jQuery

Toggle all checkboxes in tbody td by clicking on the checkbox in thead in gridview or table in asp.net

HTML

<table class="mGrid" id="ContentPlaceHolder1_grdInvited" style="border-collapse:collapse;" cellspacing="0">
    <tbody>
        <tr>
            <th scope="col" style="width:5.5%;">
                <input id="checkAll" name="ctl00$ContentPlaceHolder1$grdInvited$ctl01$chkHdrQtn" type="checkbox" >
            </th>
            <th scope="col" style="width:12%;">Resume</th>
            <th class="AlignLeft" scope="col" style="width:14.5%;"><a href="#">Name</a>

            </th>
            <th class="AlignLeft" scope="col" style="width:38.5%;"><a href="#">Email</a>

            </th>
            <th class="AlignLeft" scope="col"><a href="#">Phone</a>

            </th>
            <th scope="col"><a href="#">Invited Date</a>

            </th>
        </tr>
        <tr>
            <td>
                <input id="ContentPlaceHolder1_grdInvited_chkSelect_0" checked name="ctl00$ContentPlaceHolder1$grdInvited$ctl02$chkSelect" onclick="checkSelect(this);" type="checkbox" class="selectMe">
            </td>
            <td>
                <div id="ContentPlaceHolder1_grdInvited_UpdatePanel2_0">
                    <input name="ctl00$ContentPlaceHolder1$grdInvited$ctl02$imgInvitedIcon" id="ContentPlaceHolder1_grdInvited_imgInvitedIcon_0" disabled="disabled" title="Resume not uploaded" class="aspNetDisabled" src="http://placehold.it/30x30/" type="image">
                </div>
            </td>
            <td class="AlignLeft"> <a id="ContentPlaceHolder1_grdInvited_lBtnEditCandidate_0" href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$grdInvited$ctl02$lBtnEditCandidate','')">fgfdg</a>

            </td>
            <td class="AlignLeft"> <span id="ContentPlaceHolder1_grdInvited_lblEmail_0">[email protected]</span>

            </td>
            <td class="AlignLeft"> <span id="ContentPlaceHolder1_grdInvited_lblPhone_0"></span>

            </td>
            <td>27 Nov 13</td>
        </tr>
        <tr class="alt">
            <td>
                <input...

CSS

.actions {
    display:none;
}

JavaScript

$(function () {
     // Just pass the gridview id or class name where it has checkbox in header as well as in each row.
    var grd = $('.mGrid'); 
    var headChk = grd.find('th>input:checkbox');
    var checks = grd.find('td>input:checkbox').not(":disabled");
    var checkednum = $(checks).not(':checked').length
    var trlength = $(grd).find('tr').length - 1;
    alert(trlength);
     $('#txtCounts').val(checkednum);
    $(headChk).change(function () {
        $(checks).prop('checked', $(this).prop('checked'));
        if(grd.find("td>input:checkbox:checked").length ==  grd.find("td>input:checkbox").length) {            
           $('#txtCounts').val($(checks).not(':checked').length);
        } else {
          $('#txtCounts').val($(checks).length);
  
        }
    });
    // to check or unchect top selector
    $(checks).change(function () {
        var bol = grd.find("td>input:checkbox:checked");
        var b = grd.find("td>input:checkbox");
        var a = bol.length;
        var c = (b.length);
        //  if ($(checks).length == $("checks:checked").length) 
        if (a == c) {
            $(headChk).prop("checked", true);
        } else {
            $(headChk).prop("checked", false);
        }
 
        if(a >= 1) {  
 $('#txtCounts').val($(checks).not(':checked').length);            
        } else {
   $('#txtCounts').val($(checks).length);
        }
    });
});