JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text"  />
<br />
result: <div id="result"></div><br />
<br /><br />
<button>change value</button>

CSS

#result{height: 30px; display: inline-block; background: #f3f3f3; width: 150px;}

JavaScript

$("input").change(function(){
   $("#result").text($(this).val()); 
    alert("changed");
});

$("button").click(function(){
   $("input").val("3"); 
});

(function($){
    var originalVal = $.fn.val;
    $.fn.val = function(){
        var prev;
        if(arguments.length>0){
            prev = originalVal.apply(this,[]);
        }
        var result =originalVal.apply(this,arguments);
        if(arguments.length>0 && prev!=originalVal.apply(this,[]))
            $(this).change();
        return result;
    };
})(jQuery);