Question

I want to do the above subject matter for the phrase “Include items above during check out”. When I debug via Firebug, the correct lines in the script are getting hit, but the color never changes.

Can somebody tell me what’s wrong?

HTML

<td colspan="7" valign="middle" align="left" class="underline" style="line-height: 20px;padding: 0; color: #fff;">
    <span class="eg_checkbox" style="font-weight:bold;">
        <input id="ctl00_mainContentPlaceHolder_datalistDTO_ctl01_chkShiptoSubmit" type="checkbox" name="ctl00$mainContentPlaceHolder$datalistDTO$ctl01$chkShiptoSubmit" checked="checked" onclick="javascript:setTimeout('__doPostBack(\'ctl00$mainContentPlaceHolder$datalistDTO$ctl01$chkShiptoSubmit\',\'\')', 0)"/>
        <label for="ctl00_mainContentPlaceHolder_datalistDTO_ctl01_chkShiptoSubmit">Include items above during check out</label>
    </span>
</td>

JS

$(document).ready(function () {
    if ($('#ctl00_mainContentPlaceHolder_datalistDTO_ctl01_chkShiptoSubmit').is(':checked')) {
        $('label[for=#ctl00_mainContentPlaceHolder_datalistDTO_ctl01_chkShiptoSubmit]').css('color', 'red');
    }
    else {
        $('label[for=#ctl00_mainContentPlaceHolder_datalistDTO_ctl01_chkShiptoSubmit]').css('color', 'blue');
    }
});

Answer 1

Your ‘for’ selector is wrong in your jquery:

$(document).ready(function() {
    if ($('#ctl00_mainContentPlaceHolder_datalistDTO_ctl01_chkShiptoSubmit').is(':checked')) {
        $('label[for="ctl00_mainContentPlaceHolder_datalistDTO_ctl01_chkShiptoSubmit"]').css('color', 'red');
    }
    else {
        $('label[for="ctl00_mainContentPlaceHolder_datalistDTO_ctl01_chkShiptoSubmit"]').css('color', 'blue');
    }
});​

DEMO