title: HTML5 form display [object HTMLInputElement][object HTMLInputElement] instead of actual result of addition of two numbers
body: <p>I'm new to html5 and javascript and is writing a simple form using html5 and javascript. When I press run in netbeans, the form appears in chromo as expected, but when I enter two numbers and press add, instead of displaying <code>3</code> in the result colume, <code>[object HTMLInputElement][object HTMLInputElement]</code> is displayed instead.</p>
  
  <p><a href="https://i.stack.imgur.com/BpjAI.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/BpjAI.png" alt="enter image description here"></a></p>
  
  <p>Could someone please tell me why this is happening? How can I fix this error?</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;TODO supply a title&lt;/title&gt;
          &lt;link rel="shortcut icon" href=""&gt;&lt;!--this is to be removed for production code, its been placed here because otherwise netbeans produce error message--&gt;
  
          &lt;meta charset="UTF-8"&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
  
          &lt;script type="text/javascript"&gt;
              function addTwoNumbers() {
                  var firstNumber = document.getElementById("txtFirstNumber").valueOf();
                  var secondNumber = document.getElementById("txtSecondNumber").valueOf();
  
                  document.getElementById("txtResult").value = firstNumber + secondNumber;
              }
          &lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;form&gt;
              First number&lt;br&gt;
              &lt;input type="text" ID="txtFirstNumber"&gt;&lt;br&gt;
              Second number&lt;br&gt;
              &lt;input type="text" ID="txtSecondNumber"&gt;&lt;br&gt;
              Result:&lt;br&gt;
              &lt;input type="text" ID="txtResult"&gt;&lt;br&gt;
              &lt;br&gt;
              &lt;input type="button" value='add' id='btnAdd' onclick="addTwoNumbers()" /&gt;
          &lt;/form&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>