JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>

<html>
<head>
	
</head>

<body>
	<input class='number-one' type='number'>
	<input class='number-two' type='number'>

	<button class='plus'>+</button>
	<button class='minus'>-</button>
	<button class='divide'>/</button>
	<button class='multiply'>x</button>

	

	<p class='result'></p>


	<script src="./app.js">
		
	</script>
</body>




</html>

JavaScript

let numberOne = document.querySelector('.number-one')
let numberTwo = document.querySelector('.number-two')

let plusButton = document.querySelector('.plus')
let minusButton = document.querySelector('.minus')
let divideButton = document.querySelector('.divide')
let multiplyButton = document.querySelector('.multiply')

let resultText = document.querySelector('.result')

plusButton.addEventListener('click', function() {

	let numOne = parseInt(numberOne.value)
	let numTwo = parseInt(numerTwo.value)

	let sum = numOne + numTwo

	resultText.innerText = sum

})