JSFiddle - React, Tailwind, and code Playground

HTML

<textarea id="MyTextBox1" class="MyTextBox" cols="60" rows="8"></textarea>
<p><input type="button" id="reLimit" value ="relimit"/><span id="remainingWords1"></span></p>
<textarea id="MyTextBox2" class="MyTextBox diff" cols="60" rows="8"></textarea>
<textarea id="MyTextBox3" class="MyTextBox diff" cols="60" rows="8"></textarea>
<textarea id="MyTextBox4" class="MyTextBox diff" cols="60" rows="8"></textarea>
<p><span id="remainingWords2"></span></p>
<p><span id="ExtraWords" style="font-family: Cambria; font-size: large; color: Red;"></span></p>

CSS

tghdrdfsgfsdegdsffgsgsgdsgfsfgfdsccvxsfadegsfgfdgssdgfdsfgsdgdsfgfdsgsdfgffdsfgdfsgsfgfsdfgsdgdsgfsdfgsddfgsgfsgdsgfdsgdgffgffgfffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff

JavaScript

jQuery.fn.extend({
lengthLimit: function(limit,disabled,$label,multipleClassName) {
    this.unbind("keyup.keyupTextLimits");
    return this.bind("keyup.keyupTextLimits",function() {
        var allSelector=$("."+multipleClassName).add($(this));
        var otherFieldsLength=0;
        allSelector.not(this).each(function() { 
            otherFieldsLength+=this.value.length;
        });
        var val=$(this).val();    
        var len =val.length+otherFieldsLength;
        if (len > limit) {
            allSelector.each(function(){
                $(this).val(val.substring(0, limit));
                if(disabled) $(this).attr('readonly','readonly');
            });
        } else {
            $label.text((limit-len)+" Words Remaining");
        }           
    });
}
});
$("#MyTextBox1").lengthLimit(50,true,$("#remainingWords1"));
$(".diff").lengthLimit(20,true,$("#remainingWords2"),"diff");
$("#reLimit").click(function(){
   $("#MyTextBox1").lengthLimit(20,true,$("#remainingWords1"));
});