how to get the value of document.getElementById

Hi I have a form with two select drop down i've gave each their own different ID but now i am trying to use the document.getElementById on both but its only picking up second one how can I get so that depending on the select iD user picks it would be like if document.getElementById("location") alert location else if document.getElementById("color") alert color.

I have tried but its just call the second document.getElementById("color")

Heres' the form

<form action="<?php bloginfo('url'); ?>" method="get" class="x">
<select id="location" >
 <option value="america">Great Site</option>
 <option value="england">Better Site</option>
</select>

<select id="color" >
 <option value="blue">Great Site</option>
 <option value="red">Better Site</option>
</select>
</form>

HTML:

here the function I have tried but doesnt work it skips the first if statment how can i get to select the if statement depending on the select ID the user picks

function()
	{
	 var selectBox = document.getElementById("location");
	 var selectBox1 = document.getElementById("color");
   	 var selectValue = selectBox.options[selectBox.selectedIndex].value;
	

   		if (selectBox == "location")
			{
			alert("location");
			}
			else
		 if (selectBox1 == "color");
			{
				alert("color");
			}
		
	}}}(jQuery,window,undefined));

Code (markup):

 

There are a couple of instances in your code where the 'if' statements aren't using the correct variable. They test the object and not the object's 'value' property.

 

Hi i have tried this way the alert on the first function runs which show the function is working but then it doesnt send the value holder into the second function? help me please

<script type="text/javascript">
function category1()
{
var carname="Volvo";
alert (carname)
document.getElementById("holder").innerHTML=carname;
}
</script>

Code (markup):

but when get to the if statment functions it doesnt run

function()
	{
	 var selectBox = document.getElementById(holder);
   	 var selectValue = selectBox.options[selectBox.selectedIndex].value;
	
   // location.href = 'http://www.gopherdeals.co.uk/?dl='+ selectValue +'&s=+&dc=';
   		if (document.getElementById("addidas"))
			{
			alert("sports");
			}
			else
		 if (document.getElementById("Volvo"));
			{
				alert("cars");
			}

Code (markup):

 

Your logic flow makes no sense at all -- you have both selects,they both have values, why the else? OF COURSE its only returning one of them.

For the life of me I can't even figure out what you are even trying to do in either code example, neither of which makes the least bit of sense whatsoever. Can you explain what it is you are actually trying to do, because your code is unclear/nonsensical... You get the two selects, you then pull the value of just one of them, then you try to do a string compare against two [object] results, meaning NEITHER if statement should actually run...