Textbox or textarea with word count (Javascript) in Twine Sugarcube 2

In the code below:

1. A text area is created with HTML. It has an id of “ID”.

2. It is initially filled with an existing variable ($VAR). If the text area should be blank, delete this.

3. The span with ID “show” is where the word count will appear.

4. The “Display as output” section changes the color of the word count span to red if it goes over a certain word count (150), green if not.

5. Note that at the bottom, after the script, the $VAR is redefined as what is in the text area (by text area ID).

Word Count: 0 <><> postdisplay[‘read-ID’] = function (t) {     $(‘#ID’).on(‘keyup’, function () {         // Get the input text value         var words = document.getElementById(“ID”).value;

// Initialize the word counter         var count = 0;

// Split the words on each space character         var split = words.split(’ ');

// Loop through the words and increase the counter when each split word is not empty

for (var i = 0; i < split.length; i++) {                 if (split[i] != “”) {                     count += 1;                 }             }

// Display it as output         if (count > 100) {             ('#show').css('color', 'red');             document.getElementById("show").innerHTML = count;         } else {             KaTeX parse error: Expected 'EOF', got '#' at position 3: ('#̲show').css('col…(‘#show’).css(‘color’, ‘green’);             document.getElementById(“show”).innerHTML = count;         }

}); }; <> <<set $VAR = document.getElementById(“ID").value>> <>