checkbox全選択時のみ他要素にクラスを付与したい

Question

checkbox全選択時のみ他要素にクラスを付与したいです。

具体的には以下のような構成で、checkbox全選択時のみ「hoge」に「selected」というclassを付与したいです。

<input type="checkbox" value="" id="check01">
<input type="checkbox" value="" id="check02">
<input type="checkbox" value="" id="check03">

<div class="hoge"></div>

以下の内容を試したのですが、うまくいきませんでした。

if($('#check01,#check02,#check03').is(':checked')) {
  $('.hoge').addClass("selected");
   }
   else {
  $('.hoge').removeClass("selected");
   }

ご教授の程よろしくお願いいたします。

Answer 1

.selected{color:red};

$(function(){
  $('#check01,#check02,#check03').on('change',function(){
    var l1=$('#check01,#check02,#check03').filter(":checked").length;
    var l2=$('#check01,#check02,#check03').length;
    $('.hoge').toggleClass('selected',l1==l2);
  });
});

<input type="checkbox" value="" id="check01">
<input type="checkbox" value="" id="check02">
<input type="checkbox" value="" id="check03">

<div class="hoge">hoge</div>

Comments

[castail]

ご教授いた内容で実現できました！
感謝いたします。ありがとうございました。

Answer 2

多分もっといいやり方があるかもしれませんが

var ck_selector = '#check01,#check02,#check03';
var ck_num = ck_selector.split(',');
var ck_cnt = 0;

$(ck_selector).on('change',function(){
	
	$(ck_selector).each(function(){
		if($(this).is(':checked')){
			ck_cnt++;
		}
	});

	if(ck_num.length == ck_cnt){
		$('.hoge').addClass("selected");
	}else{
		$('.hoge').removeClass("selected");
	}
});

Comments

[castail]

ご教授ありがとうございました。
今回は先にご回答頂いた「yambejp」様をベストアンサーとさせて頂きます。
あしからず御了承ください。