JSFiddle - React, Tailwind, and code Playground

by DannyEnglander

HTML

<input type="text" id="input">


Total chars: <span id="character-count">0</span>

JavaScript

var input = $('input#input'), firstInput = true;

$('span#character-count').text(input.val().length);

input.bind('keydown, keyup', function(e) {

  $('span#character-count').text(0);
  $('span#character-count').text(input.val().length);

  if (this.value.length >= 20) {
    $('#character-count').css("background", "red");
    console.log(this.value.length);
    $('span#character-count').append('hello, greater than 20');
  }
});