Count Number Of Checkboxes Checked In A Table Column

I am now struggling with counting number of checkboxes checked in a column. I am trying to count them and display a total at the bottom. My html is as follows. There are alot more

Solution 1:

To get the index of :nth-child()(index starts from 1), you need to add 1 to the value of .index()(starts from 0)

$('#tblRootCauseBody').on('change', 'input[type=checkbox]', function() {
  var index = $(this).closest('td').index() + 1,
    $checked = $(" #tblRootCauseBody tr:not(:last-child) td:nth-child(" + (index) + ") input:checked");
  $('#tblRootCauseBody tr:last-child > :nth-child(' + index + ')').text($checked.length);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody id="tblRootCauseBody">
    <tr>
      <th>Public Safety</th>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td></td>
    </tr>
    <tr>
      <th>SSW/MS</th>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td>
        <div class="text-center">
          <label class="checkbox-inline">
            <input type="checkbox" class="chkRootCauseSummary" />
          </label>
        </div>
      </td>
      <td></td>
    </tr>
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
  </tbody>
</table>