Select options question

by Laura

HTML

<h3>A demonstration of how to access a SELECT element</h3>

<select id="mySelect" size="2">
  <option value="1">Suits</option>
  <option value="2">Supernatural</option>
</select>

<p>Click the button to select the show and display a random quote.</p>

<button id="myBtn">Submit</button>

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

JavaScript

document.getElementById("myBtn").addEventListener("click", function(){
	myFunction();
});

function myFunction() {
  var suits = ["Specter is fat", "Ross is fat", "Pearsonis fat", "Litt is fat", "Zane is fat"];
  var supernatural = ["Dean is fat", "Sam is fat", "Castiel is fat"];
  var e = document.getElementById("mySelect");
  var x = e.options[e.selectedIndex].value;
  switch (x) {
    case 1:
      var quote = suits[Math.floor(Math.random() * suits.length)];
      break;
    case 2:
      var quote = supernatural[Math.floor(Math.random() * supernatural.length)];
      break;
   	default:
    	var quote = "Switch didn't work.";
  }
  document.getElementById("demo").innerHTML = quote;
  document.getElementById("Option").innerHTML = x;
}