index.html

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="jquery.password.js"></script>
<input type="password" name="paswd1" class="pass" />

<style type="text/css">
	.iconview:before {
		content: "\f099"
	}
</style>
<script type="text/javascript">
	$(function() {
		$(".pass").xpassword({preview : true, previewFontClass : 'iconview'});
	})
</script>

jquery.password.js

/*
  JQuery plugin for password fields to show last typed character
  author: Tofeeq ur Rehamn (tofeeq3@gmail.com)
  example : $(".elem").xpassword();
 */
(function ($) {
	$.fn.xpassword = function (options) {
		var settings = $.extend({
			preview: false,
			previewFontClass: 'eye'
		}, options);

		function getSelectedText() {
			var text = "";
			if (typeof window.getSelection != "undefined") {
				text = window.getSelection().toString();
			} else if (typeof document.selection != "undefined" && document.selection.type == "Text") {
				text = document.selection.createRange().text;
			}
			return text;
		}

		this.each(function () {
			var $inp = $(this);
			//add temporary element before input password
			var timer = "";

			//create a hidden text field to hold the original value what user entered
			var $hiddenPass = $('<input type="hidden" />');
			$inp.after($hiddenPass);

			if (settings.preview) {
				var $preview = $('<i class="' + settings.previewFontClass + '"></i>');
				$inp.after($preview);
				$preview.css({
					"cursor": "pointer"
				});

				$preview.on('click', function () {
					$inp.val($hiddenPass.val());
					setTimeout(function () {
						$inp.val(stars($inp.val().length));
					}, 1000);
				});
			}
			//remove name from input and add to the hidden field as this is the one 
			//which will have original value, input will have stars which are not readable
			$hiddenPass.attr("name", $inp.attr("name"));

			//remove name from input as this will be used for just display
			$inp.attr("type", "text").removeAttr("name");

			//get current typed character from keyboard and append it to the hidden field
			$inp.on("keypress", function (e) {
				var code = e.which;
				if (code >= 32 && code <= 127) {
					var character = String.fromCharCode(code);
					if (getSelectedText().length) {
						$hiddenPass.val(character);
					} else {
						$hiddenPass.val($hiddenPass.val() + character);
					}
				}
			});

			//convert last typed character to star
			$inp.on("keyup", function (e) {

				var code = e.which;

				if (code == 8) {
					//if removing 
					var length = $inp.val().length;
					$hiddenPass.val($hiddenPass.val().substring(0, length));
				} else if (code == 37) {

				} else {
					var current_val = $inp.val().length;
					$inp.val(stars(current_val - 1) + $inp.val().substring(current_val -
						1));
				}

				if (timer) {
					clearTimeout(timer);
				}

				timer = setTimeout(function () {
					$inp.val(stars($inp.val().length));
				}, 200);
			});
		});



		function stars(n) {
			var stars = "";
			for (var i = 0; i < n; i++) {
				stars += "*";
			}
			return stars;
		}

		return this;
	}
}(jQuery));

Jquery plugin for password field, showing last typed character with a preview button (icon)