JSFiddle - React, Tailwind, and code Playground

by Eric Time

HTML

<ul id="arguments">
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
</ul>
<h1 id="result"></h1>
<h1 id="result2"></h1>

JavaScript

function compute(params){
    var resultBox=params.resultBox,
        calculate=params.calculate,
        arguments=document.querySelectorAll('#arguments li'),
        resultBox=document.querySelector(resultBox),
        args=[];

    for(var i in arguments){
        var arg=arguments[i];
        args.push(Number(arg.innerText));
    }

    var result=calculate.apply(this,args);
    resultBox.innerText=result;
}

compute({
    resultBox:'#result',
    calculate:function(a,b,c){
        return a+b+c
    }
})

compute({
    resultBox:'#result2',
    calculate:function(a,b,c,d){
        return a*b*d
    }
})