javascript - Toggle Checkbox with jQuery on parent click -

i have following code example: http://jsfiddle.net/sx3w9/

$('.item').on('click', function() {             var checkbox = $(this).find('input');             checkbox.attr("checked", !checkbox.attr("checked"));                 $(this).toggleclass('selected');         }); 

where user should able click div.item and/or checkbox inside , should check or uncheck checkbox , add or remove selected class div.

it works when clicking div, clicking checkbox instantly unchecks again...

try following code:

$('.item').on('click', function() {             var checkbox = $(this).find('input');             checkbox.attr("checked", !checkbox.attr("checked"));                 $(this).toggleclass('selected');         }); $(".item input").on("click", function(e){     e.stoppropagation();     $(this).parents(".item").toggleclass('selected'); }); 

the problem when check checkbox clicking on div occurs , makes checbox unchecked again.