Do you have a password field that the user wants to be able to view at the click of a button? Here is the solution I came up with to handle that need…
The field…
<div class="input-group">
<input type="password" name="password" value="P@$$w0rD" placeholder="Password" id="input-password" class="form-control" required>
<span id="view-password" class="input-group-addon"><i class="fa fa-eye" aria-hidden="true"></i></span>
</div>
The javascript…
<script><!-- $('#view-password').click(function(){ $password = $('#input-password'); if ($password.prop('type') == 'password') { $password.prop('type', 'text'); } else { $password.prop('type', 'password'); } $('i', this).toggleClass('fa-eye-slash'); }); //--></script>
This example relies on Bootstrap, Font Awesome, and jQuery but can easily be achieved using your a basic button and pure javascript.
jsFiddle: https://jsfiddle.net/rmullaney77/0szapv57/2
Note: Only tested with Google Chrome v60 (64-bit)