var  stateSelect = {
	initStateBoxes: function()
	{
		this.initSelect();
	},
		
				
	// when selection a drop down option, hide the current div and display the new div with the same id as the option id
	//statePullDown	
	initSelect: function()
	{		
		var stateSelector = document.getElementById('statePullDown');	
		stateSelector.onchange = function(){			
			var selectedState = this.options[this.selectedIndex].value;	
			stateSelect.newState(selectedState);
		}	
	},
	
	// add active class to selected div
	newState: function(state)
	{		
		stateSelect.removeCurrentState();		
		var newActiveState = document.getElementById(state);		
			newActiveState.className = newActiveState.className.replace('closed', 'active');						
	},
	
	// remove active class from current div
	removeCurrentState: function()
	{
		var divs = document.getElementsByTagName('div');		
		for (i = 0; i<divs.length; i++){
			if(divs[i].className.indexOf('active') !=-1){					
				divs[i].className = divs[i].className.replace('active','closed');				
			}
		}
	}
		
}	

window.onload = function(){
	stateSelect.initStateBoxes();
}