Specific select/deselect all check box code fragment not working in code but works in console

$("#enabled-all").on('click', function (event) {
    console.log("is called");
    var enabledAll = $("#enabled-all").is(':checked');
    $("[id^='enabled-row-']").prop('checked', enabledAll);
});

I have this little snippet of code that is supposed to set all of the checkboxes with id like enabled-row- to match the header Select/Deselect all checkbox. The .on('click') function is being called when toggling the select all checkbox, as proved by the console.log, however none of the checkboxes actually change to match the status. The stranger thing is that when I call the .prop('checked', bool); in console, it works and the checkboxes do change.

What could cause this discrepancy in working code?