Javascript - Coldfusion - Autopopulate After Selection

I'd like to use the code below to still select nothing - even if there is subgroups. Right now it will not allow me to default to "None" - it populates the subgroups just fine.

If I change the JavaScript suo options to 1 - it allows the "none" - but removes 1 result from the subgroup.

I'd like to be able to choose the associated subgroup when I want to - or just choose "None" also.

Thx for any help.

<select name="uid" onchange="whichCategory(this.form)">
<option value="">- Select User Group -</option>
<cfoutput query=ulist group=username>
<option value="#uid#">#username#</option>
</cfoutput>
</select>
    <script language="JavaScript1.2">
    function whichCategory(obj){
                switch (obj.uid.selectedIndex){

                <cfoutput query=ulist group=username>

                case #ulist.currentrow#:
                <cfquery name="subu" datasource="#ds#">
                select * from subusers
                where uid = '#ulist.uid#'
                order by username
                </cfquery>
                <cfquery name="subut" datasource="#ds#">
                select * from subusers
                where uid = '#ulist.uid#'
                order by username
                </cfquery>
                <cfoutput>
                obj.suo.length=#subu.recordcount#
                obj.sut.length=#subut.recordcount#
                </cfoutput>
                obj.suo.options[0].value=""
                obj.suo.options[0].text="None"
                obj.sut.options[0].value=""
                obj.sut.options[0].text="None"
                <cfset cr = 0>
                <cfloop query=subu>
                <cfoutput>
                obj.suo.options[#cr#].value="#suid#"
                obj.suo.options[#cr#].text="#username#"
                obj.sut.options[#cr#].value="#suid#"
                obj.sut.options[#cr#].text="#username#"
                </cfoutput>
                <cfset cr = cr +1>
                </cfloop>
                break;
                </cfoutput>

                }
   }
</script>

    <table cellspacing=3 cellpadding=3>
<tr>
<td class=verd9>
Home:<br>
<select name="suo" onchange="whichCategory(this.form)" class=verd9>
      <option value="">None</option>
     </select>
</td>
<td class=verd9>
Away:<br>
<select name="sut" onchange="whichCategory(this.form)" class=verd9>
      <option value="">None</option>
    </select>
</td>
</tr></table>