Click a li to check / uncheck a checkbox

I applied the next code 开发者_如何学Cto make the li check/uncheck a child checkbox when clicked. The issue is that when clicking the checkbox itself it doesn't work. I already read the post here and tried to apply the e.stopPropagation(); but still not working, any ideas?

 $('#columnList li').click(function(){
            var check = $(this).children();
            var checkVal = check.attr('value');
            var helper = $('.' + checkVal);
            console.log(helper);
            if(check.is(':checked')){
                check.attr('checked','');
                $.each(helper, function(i, e){
                    $(helper[i]).hide();
                });
            }else{
                check.attr('checked','checked');
                $.each(helper, function(i, e){
                    $(helper[i]).show();
                });
           } 
        });

        $('input[type="checkbox"]').click(function(){
            e.stopPropagation();
        });

HTML is a normal ul with a child checkbox. Nothing special about that.

Try changing -

$('input[type="checkbox"]').click(function(){
            e.stopPropagation();
        });

to -

$('input[type="checkbox"]').click(function(e){
            e.stopPropagation();
        });

You should try to pass event to the function

$('input[type="checkbox"]').click( function(e) {
    e.stopPropagation();
});