Edit in JSFiddle

#mytext {
  width: 400px;
  border: 1px solid #c7c7c7;
  box-shadow: 0px 0px 12px 1px #ccc;
  margin: 20px auto;
  display: block;
  padding: 10px;
}

#result,
h3 {
  text-align: center;
}
<form>
  <h3>
Type something and stop 
</h3>
  <textarea id="mytext" rows="10"></textarea>
  <div id="result"></div>
</form>
(function($) {
  $.fn.donetyping = function(callback) {
    var _this = $(this);
    var x_timer;
    _this.keyup(function() {
      clearTimeout(x_timer);
      x_timer = setTimeout(clear_timer, 1000);
    });

    function clear_timer() {
      clearTimeout(x_timer);
      callback.call(_this);
    }
  }
})(jQuery);

$('#mytext').donetyping(function(callback) {
  $('#result').append("done typing<br >")
});