jQuery TextArea Character Limit Counter

Display remaining characters for textarea with maxlength value.

by SullysRants

HTML

<head>
  <meta charset="utf-8">
  <title>jQuery TextArea Character Limit Counter</title>
  <style type="text/css">
    textarea {
      display: block;
      margin: 1em 0;
    }

  </style>
</head>

<body>
  <form>
    <label>TextArea (Max 15 Chars)</label>
    <textarea id="textarea" maxlength="15"></textarea>
    <span id="rchars">15</span> Character(s) Remaining
  </form>
</body>

JavaScript

var maxLength = 15;
$('#textarea').keyup(function() {
  var textlen = maxLength - $(this).val().length;
  $('#rchars').text(textlen);
});