How To Insert OPTIONs into SELECT — Cross-Platform, Even IE6

Insert OPTIONs into SELECT JavaScript only — Cross-Platform, Even IE6, IE7, IE8

by Serge

HTML

<div >Country * <select id="countrysel" name="country" onchange="CountryChange(this)">
<option value="">-</option>
<option value="38">Canada</option>
<option value="44">China</option>
<option value="178">Russia</option>
<option value="225">USA</option>
</select></div>
<div>State/Prov.*<select id="state" name="state" style="display: none;"><option value="">-</option></select>
<input id="state_other" type="text" name="province" value=""></div>

JavaScript

function CountryChange(id){
    id = id.value;
	id = parseInt(id);

    st=document.getElementById("state");
   	sto=document.getElementById("state_other");
    st.options.length=0;
    st.style.display="inline";
	sto.style.display="none";
    
    if (id == 38){ 

    	var CanadaProvinces = {52:"Ontario", 53:"Quebec", 54:"British Columbia", 55:"Alberta", 56:"Manitoba", 57:"Saskatchewan", 58:"Nova Scotia", 59:"New Brunswick", 60:"Newfoundland and Labrador",61:"Prince Edward Island", 62:"Northwest Territories", 63:"Yukon", 64:"Nunavut"};
		for(var key in CanadaProvinces) 
		{
		    var opt = document.createElement('option');
			opt.value = key;
			opt.innerHTML = CanadaProvinces[key];
			st.appendChild(opt);
		}
	} else if (id == 225){ 

	    var UnitedStates = {1:"Alabama", 2:"Alaska", 3:"Arizona", 4:"Arkansas", 5:"California", 6:"Colorado", 7:"Connecticut", 8:"D.C.", 9:"Delaware", 10:"Florida",11:"Georgia",12:"Hawaii",13:"Idaho",14:"Illinois",15:"Indiana",16:"Iowa",51:"Kansas",17:"Kentucky",18:"Louisiana",19:"Maine",20:"Maryland",21:"Massachusetts",22:"Michigan",23:"Minnesota",24:"Mississippi",25:"Missouri",26:"Montana",27:"Nebraska",28:"Nevada",29:"New Hampshire",30:"New Jersey",31:"New Mexico",32:"New York",33:"North Carolina",34:"North Dakota",35:"Ohio",36:"Oklahoma",37:"Oregon",38:"Pennsylvania",39:"Rhode Island",40:"South Carolina",41:"South Dakota",42:"Tennessee",43:"Texas",44:"Utah",45:"Vermont",46:"Virginia",47:"Washington",48:"West Virginia",49:"Wisconsin",50:"Wyoming"};
		for(var key in UnitedStates) 
		{
		    var opt = document.createElement('option');
			opt.value = key;
			opt.innerHTML = UnitedStates[key];
			st.appendChild(opt);
		}
	}else{
		st.style.display="none";
		sto.style.display="inline";
	}
}