【jQuery】inputチェックボックスがいくつチェックされたかカウントする

チェックボックスをカウントする機会があったので、まとめてみました。

HTML

<ul id="list">
  <li><label><input type="checkbox" name="cb01" value="りんご">りんご</label></li>
  <li><label><input type="checkbox" name="cb02" value="みかん">みかん</label></li>
  <li><label><input type="checkbox" name="cb03" value="メロン">メロン</label></li>
  <li><label><input type="checkbox" name="cb04" value="バナナ">バナナ</label></li>
  <li><label><input type="checkbox" name="cb05" value="いちご">いちご</label></li>
</ul>
<p class="count">0/5</p>

jQuery

var cbCnt = 0,
  cbCntMax = 5;
$(".list li input[type='checkbox']").on("click", function(){
  cbCnt = $('.list li input[type="checkbox"]:checked').length;
  $(".count").text(cbCnt + "/" + cbCntMax);
});