Additional Select Fields

I'm trying to create a little script that adds a new SELECT form element when an item is selected on the first one.


<select name="colors">
<optgroup label="Choose a Color">
<option name="red">Red</option>
<option name="green">Green</option>
<option name="blue">Blue</option>
</optgroup>
</select>


For instance, if someone selects Green, another select list appears below the first one.

Are the other select lists already going to be created in the HTML or is it generated some how? Would you could do is have them made in the HTML set all of their displays to none using CSS then depending on the option selected the corresponding select display will change to inline or block.