jQuery change input type

Question

Trying to change input type attribute from password to text.

$('.form').find('input:password').attr({type:"text"}); 

Why this doesn't work?

Answer 1

my solution:

    $('#myinput').clone().attr('type','tel').insertAfter('#myinput').prev().remove(); 

Answer 2

You can't do this with jQuery, it explicitly forbids it because IE doesn't support it (check your console you'll see an error.

You have to remove the input and create a new one if that's what you're after, for example:

$('.form').find('input:password').each(function() {    $("<input type='text' />").attr({ name: this.name, value: this.value }).insertBefore(this); }).remove(); 

You can give it a try here

To be clear on the restriction, jQuery will not allow changing type on a <button> or <input> so the behavior is cross-browser consistent (since IE doens't allow it, they decided it's disallowed everywhere). When trying you'll get this error in the console:

Error: type property can't be changed