JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
    <head>
        <title>kalkulator</title>
    </head>
    <body>
        <div id="kalkulator">
            <p>adeneo's 10 minutters kalkis</p>
            <input type="text" id="result">
            <table id="knapper">
                <tr>
                    <td><input type="button" value="7"></td>
                    <td><input type="button" value="8"></td>
                    <td><input type="button" value="9"></td>
                    <td><input type="button" value="/"></td>
                </tr>
                <tr>
                    <td><input type="button" value="4"></td>
                    <td><input type="button" value="5"></td>
                    <td><input type="button" value="6"></td>
                    <td><input type="button" value="*"></td>
                </tr>
                <tr>
                    <td><input type="button" value="1"></td>
                    <td><input type="button" value="2"></td>
                    <td><input type="button" value="3"></td>
                    <td><input type="button" value="-"></td>
                </tr>
                <tr>
                    <td><input type="button" value="C"></td>
                    <td><input type="button" value="0"></td>
                    <td><input type="button" value="="></td>
                    <td><input type="button" value="+"></td>
                </tr>
            </table>
        </div>
    </body>
</html>

CSS

#kalkulator {top: 100px; left: 100px; height: 300px; width: 300px; position: absolute; border: 4px outset #e4e4e4;}
#kalkulator p {position: relative; left: 70px; top: 5px; font-size: 12px; color: grey; font-family: arial, verdana, sans-serif;}
#result {position: absolute; height: 30px; width: 200px; left: 50px; top: 30px; box-shadow: inset 2px 2px 6px #7a7a7a; background: #fff; padding: 0 0 0 10px; font-size: 16px;}
#knapper {position: absolute; top: 85px; left: 55px; border: 4px solid #fff; padding: 2px; width: 300px background: grey;}
#knapper td { padding: 2px;}
#knapper input {padding: 10px 15px 10px 15px; text-align: center; cursor: pointer; font-size: 16px;}

JavaScript

var q=false;
$("input", "#knapper").on('click', function() {
    var res = $("#result")[0],
        val = res.value||'';
    if (this.value=='C'||q) {
        res.value=(this.value!='C'?this.value:'');
        q=false;
    }else if (this.value=='=') {
        res.value = eval(val);
        q=true;
    }else{
        res.value = val+this.value;
    }
})