JSFiddle - React, Tailwind, and code Playground

by Brian Dukes

HTML

<div class="js-weight-calc-wrap">
    <input id="rbt_0" name="federal_rbt" value="Very High" checked="checked" type="radio">
    <input id="rbt_1" name="federal_rbt" value="High" type="radio">

    <input id="stakeholders_rbt_0" name="stakeholders_rbt" value="Very High" type="radio">
    <input id="stakeholders_rbt_1" name="stakeholders_rbt" value="High" checked="checked" type="radio">
    <input id="stakeholders_rbt_2" name="stakeholders_rbt" value="Low to Moderate" type="radio">

    <p class="js-result">3</p>
</div>

JavaScript

jQuery(function ($) {
    var values = {
        'Very High' : { 
            'Very High': 5,
            'High': 4,
            'Low to Moderate': 3
        },
        'High': {
            'Very High': 4,
            'High': 3,
            'Low to Moderate': 2
        }
    };
    $('input[name*="federal"], input[name*="stakeholders"]').change(function() {
        var $this = $(this),
            $wrap = $this.closest('.js-weight-calc-wrap'),
            fedValue = $wrap.find('input[name*="federal"]:checked').val(),
            weightValue = $wrap.find('input[name*="stakeholders"]:checked').val();
        $wrap.find('.js-result').text(values[fedValue][weightValue]);
    });
});