JSFiddle - React, Tailwind, and code Playground

by Simon Hartley

HTML

<script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<select>
    <option value="10">1st number</option>
    <option value="20">1st number 2</option>
</select>
<select>
    <option value="30">2nd number</option>
    <option value="40">2nd number 2</option>
</select>
<select>
    <option value="50">3rd number</option>
    <option value="60">3rd number 2</option>
</select>
<p id="sum">Total is: </p>

JavaScript

$('select').change(function(){
    var sum = 0;
    $('select :selected').each(function() {
        sum += Number($(this).val());
    });
    $("#sum").html("Total: " +sum);
});