I came across a strange issue when attempting to add jQuery functionality initiated by a checkbox. My checkbox appears to be toggling the checked attribute, since visually the check mark toggles on click, but the "checked" attribute actually never changes.
Here's an example of my issue: http://jsfiddle.net/ez710gxL/3/
<input id="check_box_2" class="css-checkbox padding-left-3" type="checkbox" checked="checked" />
<label for="check_box_2" name="cb_lbl_2" class="css-label" style="margin-top:5px; margin-left:10px;">Show Note</label>
My question is: If the checked attribute does not change, how can I use jQuery to determine if the checkbox is checked or not?
Ok, so apparently the issue was not with the prop/attr toggling "checked", but rather the property updating when viewing the browser's developer tools. When I inspect the checkbox, the checked property ALWAYS stays "checked", however the following code works to determine if the checkbox is actually checked or not (@War10ck's suggested code):
$('#check_box_2').is(':checked')