Button: Dynamically injecting a "checked" checkbox has the incorrect state

[duereg]

I am trying to create a button that contains a checkbox - but not a checkbox button.

In my code, I set the state of the checkbox to checked. If I load this checkbox without putting it into the button, I can confirm that the checkbox is checked.

However, as soon as the div containing the checkbox has .button called on it, the checkbox is unchecked.

​http://jsfiddle.net/KzsVG/6/

I've tested this against IE 9, Firefox 4, Chrome 12, and this behavior is consistent across browsers.

[Scott González]

This only happens with when the checkbox is checked programmatically. Changing the code to created a checked checkbox using $( "<input type=checkbox checked>" ) doesn't have a problem.

[bchiasson]

It seems like you are trying to reflect the state of the "button" in this situation. Please see the below JSFiddle for an example of how you might accomplish this without using a "checkbox" within a button.

​http://jsfiddle.net/bchiasson/KzsVG/7/