Есть ли способ скрыть заголовок таблицы, если все строки скрыты?

Question

Я не могу скрыть заголовок таблицы и элемент next () после таблицы, когда все строки таблицы скрыты.Количество строк скрытых строк не соответствует фактическим строкам в таблице.

Этот код работает в jsfiddle за исключением того, что я хочу.Как проверить, имеет ли таблица нулевые видимые строки и если таблица имеет нулевые видимые строки, скрыть элемент, который находится после этой конкретной таблицы?

$(document).ready(function() {

  $('#chkNA,#chkSC,#chkNS,#chkIss,#chkIP').click(function() {
    var cusid;
    var row;
    if (this.id == 'chkNS') {
      row = $('.TF-StatusNotStarted').closest('tr');
    }
    if (this.id == 'chkSC') {
      row = $('.TF-StatusCompleted').closest('tr');
    }
    if (this.id == 'chkNA') {
      row = $('.TF-StatusNA').closest('tr');
    }
    if (this.id == 'chkIss') {
      row = $('.TF-StatusIssue').closest('tr');
    }
    if (this.id == 'chkIP') {
      row = $('.TF-StatusInProgress').closest('tr');
    }



    row.toggle();
    row.parent().parent().next().toggle()


  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<input id="chkNA" type="checkbox" checked="checked"> N/A <input id="chkSC" type="checkbox" checked="checked"> Completed <input id="chkNS" type="checkbox" checked="checked"> Not Started <input id="chkIss" type="checkbox" checked="checked"> Issue
<input
  id="chkIP" type="checkbox" checked="checked"> In Progress


  <table class="TF-TaskGroupTable" id="ctl00_ctl41_g_ec749742_6e89_44e6_b062_0e048bf638a6_TableTaskGroup_49" border="1">
    <tbody>
      <tr>
        <th colspan=3>
          First Table
        </th>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusCompleted">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option selected="selected" value="Completed">Completed</option>
            <option value="Issue">Issue</option>
            <option value="N/A">N/A</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusCompleted">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option selected="selected" value="Completed">Completed</option>
            <option value="Issue">Issue</option>
            <option value="N/A">N/A</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusCompleted">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option selected="selected" value="Completed">Completed</option>
            <option value="Issue">Issue</option>
            <option value="N/A">N/A</option>
          </select>
        </td>
      </tr>
    </tbody>
  </table>
  <div>

    <input type="button" />
  </div>


  <table class="TF-TaskGroupTable" id="ctl00_ctl41_g_ec749742_6e89_44e6_b062_0e048bf638a6_TableTaskGroup_50" border="1">
    <tbody>
      <tr>
        <th colspan=3>
          Second Table
        </th>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusNA">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option value="Completed">Completed</option>
            <option value="Issue">Issue</option>
            <option selected="selected" value="N/A">N/A</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusCompleted">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option selected="selected" value="Completed">Completed</option>
            <option value="Issue">Issue</option>
            <option value="N/A">N/A</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusNA">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option>Completed</option>
            <option value="Issue">Issue</option>
            <option selected="selected" value="N/A">N/A</option>
          </select>
        </td>
      </tr>
    </tbody>
  </table>
  <div>

    <input type="button" />
  </div>
  <table class="TF-TaskGroupTable" id="ctl00_ctl41_g_ec749742_6e89_44e6_b062_0e048bf638a6_TableTaskGroup_51" border="1">
    <tbody>
      <tr>
        <th colspan=3>
          Third Table
        </th>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusNA">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option value="Completed">Completed</option>
            <option value="Issue">Issue</option>
            <option selected="selected" value="N/A">N/A</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusNA">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option value="Completed">Completed</option>
            <option value="Issue">Issue</option>
            <option selected="selected" value="N/A">N/A</option>
          </select>
        </td>
      </tr>
      <tr>
        <td>
          <select class="TF-StatusNA">
            <option value="Not Started">Not Started</option>
            <option value="In Progress">In Progress</option>
            <option value="Completed">Completed</option>
            <option value="Issue">Issue</option>
            <option selected="selected" value="N/A">N/A</option>
          </select>
        </td>
      </tr>
    </tbody>
  </table>
  <div>

    <input type="button" />
  </div>