jQuery checkbox check/uncheck [duplicate]

Question

What would be a proper way to check/uncheck checkbox that's placed inside the element that triggers my function?

Here's my code:

<table id="news_list"> <tr>     <td><input type="checkbox" name="news[1]" /></td>     <td>TEXT</td> </tr></table>  $("#news_list tr").click(function() {     var ele = $(this).find('input');     if(ele.is(':checked')){         ele.removeAttr('checked');         $(this).removeClass('admin_checked');     }else{         ele.attr('checked', 'checked');         $(this).addClass('admin_checked');     } }); 

The problem is I can check and uncheck each box only once. After I've checked and unchecked sometimes it still does add/remove class, but never checking a box again (even when I click on checkbox, not table row).

I've tried using .bind('click') trigger, but it's the same result.

Any solutions?

Answer 1

Use .prop() instead and if we go with your code then compare like this:

Look at the example jsbin:

  $("#news_list tr").click(function () {     var ele = $(this).find(':checkbox');     if ($(':checked').length) {       ele.prop('checked', false);       $(this).removeClass('admin_checked');     } else {       ele.prop('checked', true);       $(this).addClass('admin_checked');     }  }); 

Changes:

1. Changed input to :checkbox.
2. Comparing the length of the checked checkboxes.