Dependency dropdown(Selection/Combo box) using aui script

Populate/fill second conbo box values based on first combo box selection.

Sample Code
<aui:script>
AUI().ready('aui-dialog',"node",function(A){
          A.one("#<portlet:namespace />country").on("change",function(e){
var countrySelect=  A.one("#country").val();
A.one("#<portlet:namespace />state").val("");
if(countrySelect == "CA"){
document.<portlet:namespace />fm.state.options.length=0;
document.<portlet:namespace />fm.state.options[0]=new Option("Select State...","");
                     document.<portlet:namespace />fm.state.options[1]=new Option("Canada State1","LA");
                     document.<portlet:namespace />fm.state.options[2]=new Option("Canada State2","LA2");
A.one("label[for='state']").html("Province ");  //Replace the state label to Province
}else{
document.<portlet:namespace />fm.state.options.length=0;
document.<portlet:namespace />fm.state.options[0]=new Option("Select State...","");
document.<portlet:namespace />fm.state.options[1]=new Option("Los angiles","LA");
document.<portlet:namespace />fm.state.options[2]=new Option("Los angiles1","LA1");
A.one("label[for='state']").html("State ");
}
         });

});
<!--<span class="hiddenSpellError" pre=""-->aui:script>

<aui:form name="fm" method="post">
<table>
<tr>
<td><label for="country">Country</label></td>
<aui:select label="" name="country">
<aui:option value="">Select Country...
<aui:option value="US">United State
<aui:option value="CA">Canada
<!--<span class="hiddenSpellError" pre=""-->aui:select>
</tr>
<tr>
&nbsp;
</tr>
<tr>
<td><label for="state">State </label></td>
<aui:select label="State" name="state" label="">
<aui:option value="">Select Country...
<!--<span class="hiddenSpellError" pre=""-->aui:select>
</tr>
</table>
<!--<span class="hiddenSpellError" pre=""-->aui:form>