How to create HTML for a "show password" functionality? [duplicate]

Question

Possible Duplicate:
JQuery change type of input field

Demo here:

http://jsbin.com/welcome/73795/edit

---

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>


<input type="password" name="password" />
<button>Show Password</button>

$(document).ready(function() {
  $('button').click(function() {
    $('input').attr('type', 'text');
  });
});

---

I'm trying to create a button (or checkbox) that users will be able to toggle to see their password written in plain text.

This is basically for portable devices where typing in passwords is a pain, and seeing it in plain text while writing is a UX improvement.

In my example above, changing the type of the input doesn't work.

Any suggestions on how to tackle this problem?

Answer 1

You can't change type attribute.. See workaround here : http://jsfiddle.net/Ngtp7/2/

and a variation here : http://jsfiddle.net/Ngtp7/