I'd be inclined to add the extra data as
data-
attributes on the
<option>
tags. That way, you keep the data together, and you won't forget to update the array when the list changes.
<select id="theList">
<option value="" data-price="Please Select a Size to Show Price" data-image="http://placehold.it/150x150">--Select One--</option>
<option value="1" data-price="£10" data-image="http://placehold.it/350x150">Item 1</option>
<option value="2" data-price="£20" data-image="http://placehold.it/150x350">Item 2</option>
</select>
<p>Price: <span id="priceText"></span></p>
<p>Image: <img id="theImage" src="data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=" /></p>
<script>
var updateSelectedDetails = function(){
var opt = $("#theList").find("option:selected");
$("#priceText").text(opt.data("price"));
$("#theImage").prop("src", opt.data("image"));
};
$("#theList").change(updateSelectedDetails);
updateSelectedDetails();
</script>
http://jsfiddle.net/2r606tar/[
^]