$(document).ready(function() {
	//hide all "areas within state" select boxes and "cities within Statea" inputs in states check table
	//for aestetic reasons
	
	$('table#states-check td.column-middle select').hide();		// find all selects in table and hide
	$('table#states-check td.column-right input').hide();		// find all inputs (non-checkboxes) and hide

	// set click event listeners for all checkboxes in states-table
	// first find select boxes as a reference point in each row, and for .each select box...
	$('table#states-check td.column-middle select').each(function() { 		
		var $thisSelectBox = $(this);							// $(this) refers to the found element			
		var $nextInputBox = $thisSelectBox.parent('td').next('td').find(':input');	// traverse over to find input text field
		var $checkbox = $thisSelectBox.parent('td').prev('td').find(':checkbox');	// traverse back to find the checkbox in the row
		
		// add click event to the checkbox
		$checkbox.click(function() { 
			if (this.checked) { 								// if checkbox was not clicked (and now it is b/c we are inside the click event), 
				$thisSelectBox.show();							// show select box
				 $nextInputBox.show();							// show input text field
			} else { 											// if checkbox was click (and not its not)
				$thisSelectBox.hide();							// hide
				$nextInputBox.hide();   						// hide
			}; 
		});
	});
});