How to make a drop down menu in HTML display multiple images?

Question

I want each selection on a drop down menu to display multiple things. If sensor 1 is selected, a picture of the location of sensor 1 and the address of sensor 1 needs to be displayed. I don't know how to add multiple functions to the drop down menu selections so I have tried making the address an image and trying to display multiple images with a single selection. The same goes for sensor 2 and sensor 3 but let's just work with sensor 1.

 <select onchange="$('#imageToSwap').attr('src', this.options[this.selectedIndex].value);$('#imageToSwap2').attr('src', this.options[this.selectedIndex].value);">
<option value="https://i.imgur.com/KxkwWjO.png" value="https://i.imgur.com/L8fx0iM.png"  selected>Sensor 1</option>
<option value="https://i.imgur.com/DjIuGQ0.png">Sensor 2</option>
<option value="https://i.imgur.com/IZ7FoQN.png">Sensor 3</option>
</select><img id="imageToSwap" class="profile" src="https://i.imgur.com/KxkwWjO.png"><img id="imageToSwap2" class="profile" src="https://i.imgur.com/L8fx0iM.png">

Answer 1

Y can't you do something like this?

<img id="img" src=''/>
<p>Select a new car from the list.</p>

<select id="mySelect" onchange="myFunction()">
  <option value="Audi">Audi</option>
  <option value="BMW">BMW</option>
  <option value="Mercedes">Mercedes</option>
  <option value="Volvo">Volvo</option>
</select>

<p>When you select a new car, a function is triggered which outputs the value of the selected car.</p>

<p id="demo"></p>

<script>
function myFunction() {
  var x = document.getElementById("mySelect").value;
  document.getElementById("demo").innerHTML = "You selected: " + x;
  document.getElementById("img").src='pic_bulboff.gif'
}
</script>