Run basic math in real time on a form using JavaScript

[SafetyUniversity]

@Chem

TB.render('component_ID',function(){
    var calculateAndUpdateDom = function(){
        var amountInput = $('.amount input').val();
        var quantityAmount = $('.quantity af-data-table-field').html();
        var calc = amountInput * quantityAmount;
        $('#total').html('
```+calc);
    };
    $('.math-input').keyup(function(){
        calculateAndUpdateDom();
    }).bind('DOMSubtreeModified', function(){
      calculateAndUpdateDom();
    });
});

Would this work (ChatGPT generated)?:

TB.render('component_ID', function() {
    var calculateAndUpdateDom = function() {
        var amountInput = parseFloat($('.amount input').val());
        var quantityAmount = parseFloat($('.quantity af-data-table-field').html());
        var calc = amountInput * quantityAmount;
        $('#total').html('$' + calc);
    };

    // Attach keyup event listener
    $('.math-input').keyup(function() {
        calculateAndUpdateDom();
    });

    // Create a MutationObserver instance
    var observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            calculateAndUpdateDom();
        });
    });

    // Configuration for the observer
    var config = { childList: true, subtree: true, characterData: true };

    // Target node to observe
    var targetNode = document.querySelector('.quantity af-data-table-field');

    // Start observing the target node
    if (targetNode) {
        observer.observe(targetNode, config);
    }
});