title: javascript onChange event listener not working for input form
body: <p>When I make this button:</p>
  
  <pre><code>&lt;div id="Input #1"&gt;
  &lt;label for="input1"&gt;Input #1:&lt;/label&gt;
  &lt;input type="number" id="input1" name="input1" onchange="i1set()"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And then have this JavaScript:</p>
  
  <pre><code>var i1 = undefined;
  var i1set = function(){
    i1 = document.getElementById("input1").value;
  }
  var solution = parseFloat(i1)+parseFloat(i2);
      alert(solution);
  </code></pre>
  
  <p>It works no problem.</p>
  
  <p>But, when I eliminate the onchange part of the html, and instead create an event listener in js, then I get problems. One of the problems is that having parseFloats give me "NaN" instead of a number answer... but the bigger problem is that even when I get rid of parseFloats, even with subtraction, addition, division, it gives me weird incorrect answers.</p>
  
  <p>Below is my current code that no longer works:</p>
  
  <pre><code>&lt;form&gt;
   &lt;input type="radio" id="addition" name="addition" value="addition"&gt;&lt;label&gt;Addition&lt;/label&gt;&lt;br&gt;
   &lt;input type="radio" id="subtraction" name="subtraction" value="subtraction"&gt;&lt;label&gt;Subtraction&lt;/label&gt;&lt;br&gt;
   &lt;input type="radio" id="multiplication" name="multiplication" value="multiplication"&gt;&lt;label&gt;Multiplication&lt;/label&gt;&lt;br&gt;
   &lt;input type="radio" id="division" name="division" value="division"&gt;&lt;label&gt;Division&lt;/label&gt;&lt;br&gt;
  
   &lt;div id="Input #1"&gt;
    &lt;label for="input1"&gt;Input #1:&lt;/label&gt;
    &lt;input type="number" id="input1" name="input1"&gt;
   &lt;/div&gt;
   &lt;div id="Input #2"&gt;
    &lt;label for="input2"&gt;Input #2:&lt;/label&gt;
    &lt;input type="number" id="input2" name="input2"&gt;
   &lt;/div&gt;
   &lt;input type="submit" id="submit" value="Solve" /&gt;
  &lt;/form&gt;
  
  &lt;script&gt;
  var i1 = undefined;
  var i2 = undefined;
  var i1set = function(){
  i1 = document.getElementById("input1").value;
  }
  var i2set = function(){
  i2 = document.getElementById("input2").value;
  }
  var solve = function(){
      if ( (i1 != undefined) &amp;&amp; (i2 != undefined) ) {
          if(document.getElementById('addition').checked) {
      var solution = parseFloat(i1)+parseFloat(i2);
      alert(solution);
      }
      if(document.getElementById('subtraction').checked) {
      var solution = i1-i2;
      alert(solution);
      }
      if(document.getElementById('multiplication').checked) {
      var solution = i1*i2;
      alert(solution);
      }
      if(document.getElementById('division').checked) {
      var solution = i1/i2;
      alert(solution);
      }
      }
  }
  document.getElementById("input1").addEventListener("change", i1set(), false);
  document.getElementById("input2").addEventListener("change", i2set(), false);
  document.getElementById("submit").addEventListener("click", solve, false);
  
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>