JSFiddle - React, Tailwind, and code Playground

by blue1086

HTML

<h1>Calculator</h1>

<input id="display">
    
<br/>
    
<input type='button' value='5'>
<input type='button' value='10'>
<input type='button' value='20'>
<input type='button' value='50'>
<input type='button' value='100'>
    <br/>
<input type='button' value='-5'>
<input type='button' value='-10'>
<input type='button' value='-20'>
<input type='button' value='-50'>
<input type='button' value='-100'>

JavaScript

window.onload = function () {
    // Page is ready
    
    var elems = document.getElementsByTagName('input'),
        i     = 0,
        total = 0;
    
    for (; i < elems.length; i += 1) {
        //Loops through inputs
        if (isNaN(elems[i].value) === false) {
            //Value is a number
            elems[i].onclick = function () {
                //Adds value
                total += +this.value;
                document.getElementById('display').value = total;
            };
        }
    }
}