JSFiddle - React, Tailwind, and code Playground
HTML
<textarea name="txtScript" id="word_count" cols="30" rows="10"></textarea>
<br>
Total word count: <span id="display_count">0</span> words. Words left: <span id="word_left">200</span>
JavaScript
$(document).ready(function() {
$("#word_count").on('keyup', function() {
var words = this.value.match(/\S+/g).length;
if (words > 200) {
// Split the string on first 200 words and rejoin on spaces
var trimmed = $(this).val().split(/\s+/, 200).join(" ");
// Add a space at the end to keep new typing making new words
$(this).val(trimmed + " ");
}
else {
$('#display_count').text(words);
$('#word_left').text(200-words);
}
});
});