Hide and show a list if it has some data

Hi,

I am trying to do this:

When the user select from the Driver dropdown list the DriverSubList dropdown it will get populated.  So, it like a chaines between the two dropdown list.

my problem is when the user select from the Driver list it may not have a DriverSubList.  So I want the dropdown list for the DriverSubList not show if it has no Driver that belong to it.

So, if the DriverSubList has some value show it otherwise hide .

$("#SelectDriverSubType").chained("#SelectDriverType");


function CheckList()
{
	if( $('#SelectDriverSubType').val() === '' )
	{
		 $("#ShowHideDriverSubType").hide(); 
	}
	else 
	{
		$("#ShowHideDriverSubType").show(); 
	}
}

Select allOpen in new window

 <SELECT name="SelectDriverType" id="SelectDriverType" style="width:200px;" onchange="CheckList();"> 
             <OPTION>Select ...</OPTION>	
           <cfoutput query="QDriverType">
			<OPTION value="#QDriverType.DriverTypeID#">#QDriverType.Driver#</OPTION>
			 </cfoutput>
            </SELECT>       



 <SELECT name="SelectDriverSubType" id="SelectDriverSubType" style="width:200px;">
           <cfoutput query="QDriverSubType">
			<OPTION value="#QDriverSubType.DriverSubTypeID#" class="#QDriverSubType.DriverTypeID#">#QDriverSubType.DriverSubType#</OPTION>
			 </cfoutput>
            </SELECT>

Select allOpen in new window