JSFiddle - React, Tailwind, and code Playground

by Manoj kumar Lakshman

HTML

<script src="https://code.jquery.com/jquery-2.2.2.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<textarea class="txtarea" name="description" data-maxlength="250"></textarea>

JavaScript

$(document).ready(function() {
  $('[data-maxlength]').tooltip({
      selector: 'data-toggle="tooltip"',
      placement: 'bottom',
      trigger: 'manual',
      title: '0/250 characters used'
    })
    .data('placement', 'bottom');

  $('.txtarea').each(function() {
    $(this).on('keyup', function() {
      $(this).attr('data-original-title', $(this).val().length + ' / ' + $(this).data('maxlength') + ' characters used.');
       $(this).tooltip('show');
    });
  });
});