Array In Dropdown Print Value Into Read Only Textbox

Code:
<label for = "Service">Service Required</label>
<select id= "Service">
<script type="text/javascript">
for (var i=0; i<service.length; i++)
{document.writeln("<option>" + service[i] + "</option>");}
</script>
</select>

Using this creates the dropdown box though I want to take
Code:
var service = new Array();
//log book services available
service[0] = "12 month log book service";
service[1] = "18 month log book service";
service[2] = "24 month log book service";
service[3] = "30 month log book service";
service[4] = "36 month log book service";
service[5] = "Other minor service";
service[6] = "Other major service";

var price = new Array();
//prices log book services available
price[0] = "255";
price[1] = "285";
price[2] = "530";
price[3] = "255";
price[4] = "285";
price[5] = "285";
price[6] = "540";

This is to show the expected data at this point in time though I may add or remove elements so I want the code to be flexible a= ie iterative so I want to have the dropdown element checked and compare the position of service to get the associated price though they are in two seperate arrays and cannot be changed. Basically I would like to use a if selected value the price at that position is entered into the textbox which is readonly. How would I go about this and I cannot use tools such as jquery to do this. Is there a way to set the select value to the array position on price or something as I have never had to compare two arrays or print a selected value to a textbox.