Styling ajax cascading dropdown how please?

Hello everyone, I would love to add background color to ajax cascading dropdown list when the parent control is selected. Here is my mark up:

<div><asp:DropDownList ID="ddlTest" runat="server"><asp:ListItem>Test1</asp:ListItem><asp:ListItem>Test2</asp:ListItem></asp:DropDownList></div><div class="row margin10"><div><cc1:MyDropdownList ID="ddlCountry" runat="server" DataTextField="country_name" DataValueField="country_id" ValidationGroup="product"></cc1:MyDropdownList><ajaxToolkit:CascadingDropDown ID="cdlCountry" TargetControlID="ddlCountry" PromptText="-- Select country --"
                        PromptValue="0" ServicePath="~/service/CascadingDdl.asmx" ServiceMethod="GetCountry" runat="server"
                        Category="country_id" LoadingText="Loading..." /></div><div><cc1:MyDropdownList ID="ddlState" runat="server" ValidationGroup="product" DataTextField="state_name" DataValueField="state_id"></cc1:MyDropdownList><ajaxToolkit:CascadingDropDown ID="cdlState" TargetControlID="ddlState" PromptText="-- Select state --"
        PromptValue="0" ServicePath="~/service/CascadingDdl.asmx" ServiceMethod="GetState" runat="server"
        Category="country_id" ParentControlID="ddlCountry" LoadingText="Loading..." /></div></div>

So I want to add background color to the ddlState when ddlCountry is selected. Here is my javascript to add the style:

$("select[id*=ddlCountry]").change(function () {$("select[id*=ddlState]").each(function () {$(this).children('option').css("background-color", "red");
                 });
             });

But this doesn't work. I tested my js code to this:

$("select[id*=ddlCountry]").change(function () {$("select[id*=ddlTest]").each(function () {$(this).children('option').css("background-color", "red");
                 });
             });

Then this will work. But I need to populate the child dropdown list dynamically. Anyone knows how I can fix this?

Thanks.