Enable a nested in a disabled Jquery mobile Checkbox

I'm using the JQuery Mobile Checkboxradio widget to have a list of checkboxes on a mobile site. (http://ift.tt/1YLswq7) Nested inside each checkbox there is the checkbox text/label, as well as a span element that has the word "Enable". I gave the span an onclick, which right now just does alert("HI") but here is what I would like it to do:

I would like the checkboxes to start off disabled, and then by clicking the span INSIDE the checkbox, the checkbox will enable. To enable the checkbox programmatically is simple, but the problem is this:

When the jquery checkbox is set to disabled, it disables everything inside of it - including the span that has the onclick to enable it!

<fieldset data-role="controlgroup">
                <label><input type="checkbox" id="checkbox1" disabled> <span onclick="enable()">Enable</span> Text of checkbox here. </label>
                
                <label><input type="checkbox" id="checkbox1" disabled> <span onclick="enable()">Enable</span> Text of checkbox here. </label>
                
                <label><input type="checkbox" id="checkbox1" disabled> <span onclick="enable()">Enable</span> Text of checkbox here. </label>
                
            </fieldset>

Is there any way to enable just that part of the textbox? Or maybe certain properties of the disabled checkbox can be changed inline by the span element? I've tried playing around, to no avail, because I don't understand what happens behind the scenes when the checkbox disables.