JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.pengoworks.com/workshop/jquery/calculation/jquery.calculation.min.js"></script>
<form action="" method="post" id="nutform" onsubmit="return false;">
            <h2>Taqueria Nutritionals</h2>
                
            <h4>Pick Your Meal</h4>
            
            <ul class="options">
                <li>
                    <input type="radio" id="wwheatt" name="meal" value="whole_wheat_tortilla"> Whole Wheat Tortilla
                    <span class="caloriesSum">280</span>
                    <span class="fatSum">6</span>
                    <span class="satfatSum">0</span>
                    <span class="carbsSum">44</span>
                    <span class="proteinSum">8</span>
                    <span class="sodiumSum">340</span>
                    <span class="chloesterolSum">0</span>
                </li>
                <li>
                    <input type="radio" name="meal" value="flour_tortilla"> Flour Tortilla
                    <span class="caloriesSum">290</span>
                    <span class="fatSum">6</span>
                    <span class="satfatSum">2</span>
                    <span class="carbsSum">49</span>
                    <span class="proteinSum">9</span>
                    <span class="sodiumSum">770</span>
                    <span class="chloesterolSum">0</span>
                </li>
                <li>
                    <input type="radio" name="meal" value="naked"> Naked, zero nutrients
                    <span class="caloriesSum">0</span>
                    <span class="fatSum">0</span>
                    <span class="satfatSum">0</span>
                    <span class="carbsSum">0</span>
                    <span class="proteinSum">0</span>
                    <span class="sodiumSum">0</span>
                    <span class="chloesterolSum">0</span>
                </li>
            </ul>
            
            <h4>Select Your Protein</h4>
            
            <ul class="options">
    ...

CSS

ul.options li span {display:none;}
#totals {padding:20px; background:#eee;}
#totals span {font-weight:bold;}

JavaScript

$(document).ready(function() {
    $('.options').on('change', 'input', function() {
        var $self = $(this);
        var inputType = $self.attr('type');

        if (inputType == 'radio') {
            $self.parent('li').addClass('active').siblings().removeClass('active');
        } else if (inputType == 'checkbox') {
            $self.parent('li').toggleClass('active');
        }
        runUpdate();
    });

});

function runUpdate() {
    // get the sum of the elements
    var calories = $(".caloriesSum", '.active').sum();
    var fat = $(".fatSum", '.active').sum();
    var satfat = $(".satfatSum", '.active').sum();
    var carbs = $(".carbsSum", '.active').sum();
    var protein = $(".proteinSum", '.active').sum();
    var sodium = $(".sodiumSum", '.active').sum();
    var chloresterol = $(".chloesterolSum", '.active').sum();

    // update the total
    $("#totalCalories").text(+calories.toString());
    $("#totalFat").text(+fat.toString());
    $("#totalSatFat").text(+satfat.toString());
    $("#totalCarbs").text(+carbs.toString());
    $("#totalProtein").text(+protein.toString());
    $("#totalSodium").text(+sodium.toString());
    $("#totalChloresterol").text(+chloresterol.toString());
}