Author: Stephen Korecky
Website: http://stephenkorecky.com
Plugin Website: https://github.com/skorecky/Add-Clear
NPM jQuery Plugin: https://www.npmjs.com/package/add-clear
jQuery Plugin website is outdated and read-only now. Please use NPM
jQuery Plugin: http://plugins.jquery.com/add-clear/

Add Clear is a jQuery plugin that adds a input clearing button on any input you apply it to. It clears the value, and returns focus to that field.

• Load jQuery into your project
• Load Add Clear plugin into your project
• Setup which elements you would like to apply this plugin to.

$(function(){
  $("input").addClear();
});

// Example onClear option usage
$("input").addClear({
  onClear: function(){
    alert("call back!");
  }
});

The more modern Microsoft browsers (IE10+ and Edge) have built-in clear buttons that appear automatically on text inputs. To prevent those buttons from interfering with Add Clear, you must use the ::-ms-clear CSS pseudo-element in your styles, as described here:

https://developer.mozilla.org/en-US/docs/Web/CSS/::-ms-clear