Checkbox not unchecking visually
<p>I have a form and within it is this:</p>

<pre><code>&lt;fieldset class="billing-address"&gt;
    &lt;legend&gt;Billing Address&lt;/legend&gt;
  &lt;ol&gt;
        &lt;li class="text combi"&gt;&lt;label for="bill-address1"&gt;Address:&lt;/label&gt; &lt;input size="20" value="" name="basket_order:default:bill_address1" id="bill-address1"&gt;&lt;/li&gt;
        &lt;li class="text"&gt;&lt;label for="bill-address2"&gt;Address:&lt;/label&gt; &lt;input size="20" value="" name="basket_order:default:bill_address2" id="bill-address2"&gt;&lt;/li&gt;
        &lt;li class="text"&gt;&lt;label for="bill-address3"&gt;Town/City:&lt;/label&gt; &lt;input size="20" value="" name="basket_order:default:bill_address3" id="bill-address3"&gt;&lt;/li&gt;
        &lt;li class="text"&gt;&lt;label for="bill-address4"&gt;Region:&lt;/label&gt; &lt;input size="20" value="" name="basket_order:default:bill_address4" id="bill-address4"&gt;&lt;/li&gt;
        &lt;li class="text"&gt;&lt;label for="bill-post-code"&gt;Post code:&lt;/label&gt; &lt;input size="10" value="" name="basket_order:default:bill_postcode" id="bill-post-code"&gt;&lt;/li&gt;
    &lt;/ol&gt;
&lt;/fieldset&gt;
</code></pre>

<p>For reasons too biring to go into here, I cannot get at the HTML directly and need to do things via javascript. So, I add a checkbox and label above using the following:</p>

<pre><code>$('.billing-address ol').before('&lt;input type="checkbox" id="billing-add-different" /&gt;&lt;label for="billing-add-different"&gt;My billing address is the same as my delivery address&lt;/label&gt;');

    $('#billing-add-different').prop('checked',true).toggle(
        function(){
          $('.billing-address ol input, .billing-address ol select').css('background','#CCC').attr('disabled','disabled');
        },
        function(){
          $('.billing-address ol input, .billing-address ol select').css('background','#FFF').removeAttr('disabled');
        }
      );
</code></pre>

<p>This toggles the 'disabled' attribute and background colour depending on whether it's ticked or not.</p>

<p>However, though the function is firing, the checkbox is still visually checked.</p>

<p>I've made a jsfiddle to illustrate at <a href="http://jsfiddle.net/EFQuh/" rel="nofollow">http://jsfiddle.net/EFQuh/</a>. The error occurs in Firefox 8.0, not sure about others.</p>
