<script type="text/javascript"><!-- hide from old browsers
var fb_counter = new Object;  // for assigning unique ids; keyed by field name
var fb_limit   = new Object;  // for limiting the size of growable fields
function fb_grow (baseID) {
    // inititalize the counter for this ID
    if (isNaN(fb_counter[baseID])) fb_counter[baseID] = 1;

    // don't go past the growth limit for this field
    if (fb_counter[baseID] >= fb_limit[baseID]) return;

    var base = document.getElementById(baseID + '_' + (fb_counter[baseID] - 1));

    // we are inserting after the last field
    insertPoint = base.nextSibling;

    // line break
    base.parentNode.insertBefore(document.createElement('br'), insertPoint);

    var dup = base.cloneNode(true);

    dup.setAttribute('id', baseID + '_' + fb_counter[baseID]);
    base.parentNode.insertBefore(dup, insertPoint);

    // add some padding space between the field and the "add field" button
    base.parentNode.insertBefore(document.createTextNode(' '), insertPoint);

    fb_counter[baseID]++;

    // disable the "add field" button if we are at the limit
    if (fb_counter[baseID] >= fb_limit[baseID]) {
        var addButton = document.getElementById('_grow' + '_' + baseID);
        addButton.setAttribute('disabled', 'disabled');
    }    
}

//-->
</script>
<noscript><font color="#cc0000"><b>Please enable Javascript or use a newer browser.</b></font></noscript>
<form action="TEST" method="get">
<input id="_submitted" name="_submitted" type="hidden" value="1" />
<table>
<tr valign="top">
  <td>Favorite Color</td>
  <td><input id="favorite_color_0" name="favorite_color" type="text" /> <input id="_grow_favorite_color" onclick="fb_grow('favorite_color')" type="button" value="Additional Favorite Color" /></td>
</tr>
<tr valign="top">
  <td align="center" colspan="2"><input id="_submit" name="_submit" type="submit" value="Submit" /></td>
</tr>
</table>
</form>