title: How can i display 2 different buttons in a 2 different textbox?
body: <p><a href="https://i.stack.imgur.com/4bhkY.png" rel="nofollow noreferrer">it is my html code the structure of my system</a></p>
  
  <p>i found a youtube content wherein he is creating a calculator but he only use 2 textbox, in my case i want to use 3 text box, i want the first number to display at textbox 1, i want to display second number at textbox 2 and their result will be displayed at textbox 3 </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code> function getNumber(num){
   var input_var = document.getElementById('num1');
   switch(num){
    case 1:
     input_var.value +='1';
     break;
    case 2:
     input_var.value +='2';
     break;
    case 3:
     input_var.value +='3';
     break;
    case 4:
     input_var.value +='4';
     break;
    case 5:
     input_var.value +='5';
     break;
    case 6:
     input_var.value +='6';
     break;
    case 7:
     input_var.value +='7';
     break;
    case 8:
     input_var.value +='8';
     break;
    case 9:
     input_var.value +='9';
     break;
    case 10:
     input_var.value +='0';
     break;
   }
  }
  
  function getOperand(operand){
   var input_var = document.getElementById('answer');
   switch(operand){
    case '+':
     input_var.value +='+';
     break;
    case '-':
     input_var.value +='-';
     break;
    case 'x':
     input_var.value +='*';
     break;
    case '/':
     input_var.value +='/'
     break;
    case '+/-':
     input_var.value +='-'+input_var.value;
  
    }
   }
  
  function clearScreen(){
  
   document.getElementById('answer').value = "";
   }
  
   function backspace(){
   var input_var = document.getElementById('answer');
   var x = input_var.value;
   if (x.length &gt; 0){
    x = x.substring(0,x.length-1);
    input_var.value = x;
   }
  }
  
  function compute(){
   var input_var = document.getElementById('answer');
   ans = +eval(input_var.value);
   document.getElementById('answer').value="= "+ans; 
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
   &lt;title&gt;Simple Calculator&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
   &lt;center&gt;
   &lt;table&gt;
    &lt;tr&gt;
     &lt;/tr&gt;
      &lt;td class="heading"&gt;
       Simple Math Calculator
      &lt;/td&gt;
      &lt;tr&gt;
     &lt;/tr&gt;
     &lt;td&gt;
      &lt;input type="text" id="num1" style="text-align: right;"&gt;&lt;br&gt;
      &lt;input type="text" id="num2" style="text-align: right;"&gt;&lt;br&gt;
      &lt;input type="text" id="answer" readonly="readonly" style="color: green; text-align: right;" placeholder="0"&gt;
     &lt;/td&gt;
    &lt;/tr&gt;
    &lt;td&gt;
     &lt;input type="button" value="CE" onclick="clearScreen()" style="color: white; background: red;"&gt;
     &lt;input type="button" value="&amp;#247;" onclick="getOperand('/')"&gt;
     &lt;input type="button" value="x" onclick="getOperand('x')"&gt;
     &lt;input type="button" value="&amp;#8592;" onclick="backspace()" style="color: red;"&gt;
     &lt;br&gt;
     &lt;input type="button" value="1" onclick="getNumber(1)"&gt;
     &lt;input type="button" value="2" onclick="getNumber(2)"&gt;
     &lt;input type="button" value="3" onclick="getNumber(3)"&gt;
     &lt;input type="button" value="+" onclick="getOperand('+')"&gt;
     &lt;br&gt;
     &lt;input type="button" value="4" onclick="getNumber(4)"&gt;
     &lt;input type="button" value="5" onclick="getNumber(5)"&gt;
     &lt;input type="button" value="6" onclick="getNumber(6)"&gt;
     &lt;input type="button" value="-" onclick="getOperand('-')"&gt;
     &lt;br&gt;
     &lt;input type="button" value="7" onclick="getNumber(7)"&gt;
     &lt;input type="button" value="8" onclick="getNumber(8)"&gt;
     &lt;input type="button" value="9" onclick="getNumber(9)"&gt;
     &lt;input type="button" value="+/-" onclick="getOperand('+/-')"&gt;
     &lt;br&gt;
     &lt;input type="button" value="0" onclick="getNumber(0)"&gt;
     &lt;input type="button" value="=" onclick="compute()" style="width: 120px; color: white; background: green;"&gt;
     &lt;br&gt;
  
  
  
  
  
    &lt;/td&gt;  
   &lt;/table&gt;
   &lt;/center&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>