For some reason I can't get these AJAX/JavaScript scripts to work all the time. Sometimes they do and sometimes they don't. This particular one I've spent an hour trying to get to work and it just won't work - won't display anything. Hopefully someone can explain why.

A simple HTML form is passing some data from two fields to the JavaScript function, and then that is going to a PHP file where it should spit out some info.

HTML Code:
<table width="100&#37;">
<tr>
    <td align="left">Style</td>
    <td align="left">
    <select id="style" name="style">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
    </select>
    </td>
    <td align="left">Quantity</td>
    <td align="left">
    <select id="quantity" name="quantity" onselect="javascript:get_price();">
    <option value="12-49">12-49</option>
    <option value="50-100">50-100</option>
    <option value="125_200">125-200</option>
    <option value="225-300">225-300</option>
    <option value="325-400">325-400</option>
    <option value="425-500">425-500</option>
    <option value="525-750">525-750</option>
    </select>
    </td>
    <td align="left">Price</td>
    <td id="price" align="left"> 
    </td>
  </tr>
</table>
Then this is the JavaScript:

Code:
function get_price(){
    var hr = new XMLHttpRequest();
    var url = "get_style_price.php";
    var fn = document.getElementById("style").value;
    var ln = document.getElementById("quantity").value;
    var vars = "style="+fn+"&quantity="+ln;
    hr.open("POST", url, true);
    hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    hr.onreadystatechange = function() {
	    if(hr.readyState == 4 && hr.status == 200) {
		    var return_data = hr.responseText;
			document.getElementById("price").innerHTML = return_data;
	    }
    }
    hr.send(vars);
    document.getElementById("price").innerHTML = "loading...";
}
The PHP file is just a simple DB request that I already know is debugged. It'll simply send back a number to the ID of "price", which I have the table row set as.

I've placed the JavaScript function within the page and in a separate file. In the separate file I made sure that the paths were correct, as I also did with the PHP file that the JavaScript function is referencing (get_style_price.php).

I'm not real familiar with JavaScript so I'm hoping that the problem is something that others will pick up right away...hopefully!