JSFiddle - React, Tailwind, and code Playground

by Ben Watts

HTML

<form>
    <label for="numDonut">Enter how many donuts you want:</label>
    <input type="text" id="numDonut">
    <div id="totalDonuts"></div>
    <div id="submit" onclick="callDonut();">SUBMIT</div>
</form>

JavaScript

function getTotalDonuts(donutString){
    alert(donutString);
    var initialDonutCount = parseInt(donutString);
    var finalDonuts = 0;

    if(donutString.indexOf('dozen') != -1)
        finalDonuts = initialDonutCount * 12;
    else
        finalDonuts = initialDonutCount;

    return finalDonuts;
}

function callDonut(){
    document.getElementById('totalDonuts').textContent = getTotalDonuts(document.getElementById('numDonut').value);
}