JSFiddle - React, Tailwind, and code Playground

by samsel

HTML

<link rel="stylesheet" href="https://cdn.rawgit.com/samsel/81a923490343bbc760beab59a9266aaa/raw/ff1fb3242648e3f247a5a787fc8e8d4d93c17524/kids-code-calc.css">
<html>
<body>
  <div id="answer"></div>
  <input type="number" placeholder="number 1" id="number1" />
  <input type="number" placeholder="number 2" id="number2" />
  <button id="adder" type="button">Add</button>
  <button id="multiplier" type="button">Multiply</button> 
</body>
</html>

JavaScript

document.getElementById('adder').onclick = sum;
document.getElementById('multiplier').onclick = multiply;

function sum() {
	const a = document.getElementById('number1').value;
  const b = document.getElementById('number2').value;
	const answer =  parseInt(a) + parseInt(b);
  document.getElementById('answer').innerText = answer;
}

function multiply() {
	const a = document.getElementById('number1').value;
  const b = document.getElementById('number2').value;
	const answer =  parseInt(a) * parseInt(b);
  document.getElementById('answer').innerText = answer;
}