function fillStates(opt){
  s=document.f.states.options
  s.length=stateNames[opt].length
  for(i=0;i<s.length;i++){
    s[i].value=stateNames[opt][i]
    s[i].text=stateNames[opt][i]
  }
  document.f.states.selectedIndex=0
}

<form name="f">
<select name=countries onChange="fillStates(this.options[this.selectedIndex].value)">
  <? echo $optionc; ?>
</select>
<select name=states disabled="disabled">
  <option>Choose a country first</option>
</select>
</form>