title: document.getElementById().value
body: <p>I am trying to build basic Javascript calculator. </p>
  
  <p>My HTML code is:</p>
  
  <pre><code>&lt;div id="calculator"&gt;
  
  
  
  
  &lt;div id="calcname"&gt;
          &lt;h3 id="calc"&gt;
              Basic Calculator
          &lt;/h3&gt;
      &lt;/div&gt;
      &lt;div id="display"&gt;
          &lt;input type="text" maxlength="40" size="30" name="Display" id="display" value="" /&gt; 
      &lt;/div&gt;
      &lt;div id="buttons"&gt;
          &lt;button id="seven" value="7" name="button" onclick="dplay();"&gt;
          7   
          &lt;/button&gt;
          &lt;button id="eight" value="8" name="button"&gt;
              8
          &lt;/button&gt;
          &lt;button id="nine" value="9" name="button"&gt;
              9
          &lt;/button&gt;&lt;br /&gt;
          &lt;button id="four" value="4" name="button"&gt;
              4
          &lt;/button&gt;
          &lt;button id="five" value="5" name="button"&gt;
              5
          &lt;/button&gt;
          &lt;button id="six" value="6" name="button"&gt;
              6
          &lt;/button&gt;&lt;br /&gt;
          &lt;button id="one" value="1" name="button"&gt;
              1
          &lt;/button&gt;
          &lt;button id="two" value="2" name="button"&gt;
              2
          &lt;/button&gt;
          &lt;button id="three" value="3" name="button"&gt;
              3
          &lt;/button&gt;&lt;br /&gt;
          &lt;button id="zero" value="0" name="button"&gt;
              0
          &lt;/button&gt;
          &lt;button id="dot" value="." name="button"&gt;
              .
          &lt;/button&gt;
          &lt;button id="/" value="/" name="button"&gt;
              /
          &lt;/button&gt;&lt;br /&gt;
          &lt;button id="*" value="*" name="button"&gt;
              *
          &lt;/button&gt;
          &lt;button id="-" value="-" name="button"&gt;
              -
          &lt;/button&gt;
          &lt;button id="+" value="+" name="button"&gt;
              +
          &lt;/button&gt;&lt;br /&gt;
          &lt;button id="C" value="C" name="button"&gt;
              C
          &lt;/button&gt;
          &lt;button id="AC" value="AC" name="button"&gt;
              AC
          &lt;/button&gt;
          &lt;button id="=" value="=" name="button"&gt;
              =
          &lt;/button&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>my javascript code:</p>
  
  <pre><code>function dplay(){ 
     var val=document.getElementsByTagName('button').value; 
     current+=val; 
     document.getElementByID("display").value=val; 
  } 
  </code></pre>
  
  <p>Why is that last line of code does not display value in textbox, which has <code>id="display</code>"?</p>
  
  <p>I have tried this function for only one button. When button is pressed, this code should execute. But, when I tried it does not display. </p>
  
  <p>I tried <code>innerHTML</code> property which I don't want, but even then it display undefined. I do not understand what is incorrect in above code. Please help.</p>