Checkbox check first time not working, after second time, it is OK

I am trying to create a checkbox with label. When user click the label, it will check if checkbox checked. The first time, I click the label, the box is checked, but no alert action. After I click the second time, it start to function, alert action happen. What did I do wrong. I had tried to use individual ID.click, not working either.

<script type="text/javascript">
  var elements = { "emo_lol": "1", "emo_cool": "2", "emo_cute": "3" };
   
  jQuery.each( elements, function( id_name, num ) {

    $('#'+ id_name).click(function(){
    
       if ($('#'+id_name +'_checkbox').prop('checked')) {
             alert('Checked');
         }else{
           alert('unchecked');
           }
       });
  });
</script>

<input type="checkbox" name="emo_checkbox" id="emo_lol_checkbox">
<label id="emo_lol" for="emo_lol_checkbox" >LOL !</label>
                                                        
<input type="checkbox" name="emo_checkbox"  id="emo_cool_checkbox">
<label id="emo_cool" for="emo_cool_checkbox" >COOL !</label>
                                
<input type="checkbox" name="emo_checkbox"  id="emo_cute_checkbox"> 
<label id="emo_cute" for="emo_cute_checkbox" >CUTE !</label>