JSFiddle - React, Tailwind, and code Playground

HTML

<table>
    <tr>
        <td class="grade">
            <input type="text" value="28" class="numerator" />/
            <input type="text" value="30" class="denominator" />
            <div class="result"></div>
        </td>
    </tr>
</table>

JavaScript

function update($ele) {
    var n = Number($ele.find('.numerator')[0].value);
    var d = Number($ele.find('.denominator')[0].value);
    var val = (n / d * 100);
    $ele.find('.result').text(( isNaN(val) || ! isFinite(val) ) ? '' : val.toFixed(2));
}

$('.grade').each(function() {
    update($(this));
});

$('.grade input').on('keyup', function() {
    update($(this).closest('.grade'));
});