This is a small project I have to teach kids and I looked at every single letter and don't understand why my addition function does not work properly. All of my code but the addition works properly. When I use the add function it doesn't add it just puts the two numbers together and i don't see why.
<!DOCTYPE html>
<html>
<head>
<title>Calculator </title>
</head>
<body>
<p>1st Number :</p>
<input type="text" id="firstNumber">
<p>2nd Number :</p>
<input type="text" id="secondNumber">
<div>
<button id="Add" >Add</button>
<button id="Subtract" >Subtract</button>
<button id="Multiply" >Multiply</button>
<button id="Divide" >Divide</button>
<p>The result is :</p>
<p id="answer"></p>
</div>
</body>
</html>
function Multiply(){
var num1 = document.getElementById('firstNumber').value;
var num2 = document.getElementById('secondNumber').value;
var a = num1*num2;
document.getElementById('answer').innerHTML = a;
}
function Divide(){
var num1 = document.getElementById('firstNumber').value;
var num2 = document.getElementById('secondNumber').value;
var a = num1/num2;
document.getElementById('answer').innerHTML = a;
}
function Add(){
var num1 = document.getElementById('firstNumber').value;
var num2 = document.getElementById('secondNumber').value;
var a = num1+num2;
console. log(a);
document.getElementById('answer').innerHTML = a;
}
function Subtract(){
var num1 = document.getElementById('firstNumber').value;
var num2 = document.getElementById('secondNumber').value;
var a = num1-num2;
document.getElementById('answer').innerHTML = a;
}
document.getElementById('Multiply').onclick =
Multiply;
document.getElementById('Divide').onclick =
Divide;
document.getElementById('Add').onclick =
Add;
document.getElementById('Subtract').onclick=
Subtract;