JSFiddle - React, Tailwind, and code Playground

HTML

<b>Message:</b>
<textarea name="txtVdoScript" id="word_count" cols="1" rows="1"></textarea>
<span style="padding-left:10px;">Total word Count : <span style="font-size:16px; color:black;" id="display_count">0</span> words.</span>

JavaScript

$(document).ready(function () {
    $('#word_count').wordCount();
});

jQuery.fn.wordCount = function (params) {
    var p = {
        counterElement: "display_count"
    };
    var total_words;

    if (params) {
        jQuery.extend(p, params);
    }

    //for each keypress function on text areas
    this.keypress(function () {
        total_words = this.value.split(/[\s\.\?]+/).length;
        jQuery('#' + p.counterElement).html(total_words);
    });
};