Come posso mostrare e nascondere una password con jQuery?

Mostrare e nascondere una password è un'operazione semplice in jQuery.

Partiamo dalla seguente marcatura:

<div>
	<input type="password" name="password" id="password" placeholder="Password" />
	<p><input type="checkbox" id="show-hide" />Show password</p>
</div>

Il codice jQuery modifica l'attributo type del campo a seconda della scelta dell'utente:

$( "#show-hide" ).on( "change", function() {
	if( $( this ).prop( "checked" ) ) {
		$( "#password" ).attr( "type", "text" );
	} else {
		$( "#password" ).attr( "type", "password" );	
	}
});