Changing .prop using jQuery does not trigger .change event

Question

I've got an event listener on a checkbox:

<input type="checkbox" name="something"> 

My event listener:

$('input[type="checkbox"][name="something"]').change(function() {      //DO SOMETHING  }); 

I have another event listener that changes .prop of the checkbox:

$('#button').click(function() {      $('input[type="checkbox"][name="something"]').prop("checked", false); }); 

When I check the checkbox DO SOMETHING triggers. When I click on the #button, the .prop changes and I see the checkbox visually uncheck, but DO SOMETHING doesn't get triggered...

Something I'm overlooking?

Answer 1

Change event is fired when the value is changed by users interaction on page and not when value is modified using code.

Here you need to use .change() or .trigger("change") after changing the property:

$('input[type="checkbox"][name="something"]').prop("checked", false).change(); 

Working Demo