title: How to apply a function to a button
body: <p>I have 4 drop down lists. Each drop down list has all false values and one true value, and my aim is to produce an alert message and open a new page based on the values being true. However, I would like to know how I can apply this code to a button so that the described action happens when the button is clicked because absolutely nothing happens at the moment.</p>
  
  <pre><code>&lt;input name="button" type="submit" class="main" id="button" value="Submit" onclick="submit()" /&gt;
  
  
  &lt;/script&gt;
  
  &lt;script type="javascript"&gt;
  </code></pre>
  
  <p>This is the details of my button its placed here for your reference</p>
  
  <pre><code>&lt;input name="button" type="submit" class="main" id="button" value="Submit" onclick="submit()" /&gt;
  
  var selectbox = document.getElementById("select_box"); 
  var a = selectbox.options[selectbox.selectedIndex].value;
  
  var selectbox2 = document.getElementById("select_box2"); 
  var b = selectbox2.options[selectbox2.selectedIndex].value;
  
  var selectbox3 = document.getElementById("select_box3"); 
  var c = selectbox3.options[selectbox3.selectedIndex].value;
  
  var selectbox4 = document.getElementById("select_box4"); 
  var d = selectbox4.options[selectbox4.selectedIndex].value;
  
  
  if (a == "true" &amp;&amp; b == "true" &amp;&amp; c == "true" &amp;&amp; d == "true")
  {
  alert("Correct you have won press OK for your Reward!")
  document.open("Reward.html");
  }
  else
  {
  alert("Not right Please try again!");
  }
  
  &lt;/script&gt;
  </code></pre>