VF page Command button Rerender issue loading JQUERY

Question

VF Page:

    <div class="modal-footer">                             
    <apex:commandButton id="filter" styleclass="btn btn-primary" value="Go" action="{!accountWrapperObject}" reRender="datePanelContainer" />
</div>
<apex:outputpanel id="studentTable" >
      <apex:outputPanel id="datePanelContainer"> 
            <table id="domainTable" class="table table-fixedheader table-bordered table-striped"> 
                   <thead>
                        <tr>
                           <th>
                            <div class="checkbox checkbox-primary">
                                   <input type="checkbox" name="selectAll" id="selectAllDomainList" checked="" />
                                       <label for="selectAllDomainList"> Select All  </label>
                                 </div>
                            </th>
                            <th>Student Engagement</th> 
                        </tr>
                    </thead>
                    <tbody>
                          <apex:variable value="{!1}" var="rowNum"/> 
                                  <apex:repeat value="{!wrapList}" var="e">  
                                       <tr> 
                                          <td> 
                                              <div class="checkbox checkbox-primary">
                                                  <input id="Text{!rowNum}" type="checkbox" checked=""/>
                                                        <label for="Text{!rowNum}"> Primary </label>
                                                        </div>
                                          </td>   
                                          <td><apex:outputText value="{!e.eng.Site__c}" /></td>
                                        </tr>                                             
                                     <apex:variable var="rowNum" value="{! rowNum + 1 }"/> 
                               </apex:repeat>
                        </tbody>
                    </table>
        </apex:outputPanel>
</apex:outputPanel>

JQuery:

<script type="text/javascript">  


         jQuery(function($){                        
            $('#selectAllDomainList').click (function () {
                 var checkedStatus = this.checked;
                $('#domainTable tbody tr').find('td:first :checkbox').each(function () {
                    $(this).prop('checked', checkedStatus);
                 });
            });
        }); 
     </script>

Issue:

Issue with command button rerender. reRender="datePanelContainer". If I use this, SelectAll check box Jquery function does not fire and it will not check all the checkboxes.

Can anyone help me where I am missing?

UPDATE:

JQUERY:

<script>
        function addListener() {
            $('#selectAllDomainList').click (function () {
                 var checkedStatus = this.checked;
                $('#domainTable tbody tr').find('td:first :checkbox').each(function () {
                    $(this).prop('checked', checkedStatus);
                 });
            });
        }
        // Add listener when page loads
        addListener();
     </script>

Regards, Ajay

Answer 1

Add this to the apex:commandButton:

oncomplete="addListener()"

and change the JavaScript to this:

<script>
function addListener() {
    // Put your existing jQuery code in here
}
// Add listener when page loads
addListener();
</script>

so that the jQuery logic is applied to the page elements both when the page loads and when the re-render is complete and there are new elements added to the page.

Answer 2

I fixed the issue by changing the function to

function testFuntion(t){    
      var checkedStatus = t.checked;
                $('#domainTable tbody tr').find('td:first :checkbox').each(function () {
                    $(this).prop('checked', checkedStatus);
                 });

     } 

And I called this function on SelectAllcheckbox