Jquery show/hide password

Question

Below Jquery is working fine but How could I shorten this Jquery? I have to show and hide the password for password and confirmed password? https://jsfiddle.net/c5cvLo54/1/

Answer 1

Here is one-of-the ways, how you can shorten your code:

$(document).ready(function() {

  $(".show-password, .hide-password").on('click', function() {
    var passwordId = $(this).parents('li:first').find('input').attr('id');
    if ($(this).hasClass('show-password')) {
      $("#" + passwordId).attr("type", "text");
      $(this).parent().find(".show-password").hide();
      $(this).parent().find(".hide-password").show();
    } else {
      $("#" + passwordId).attr("type", "password");
      $(this).parent().find(".hide-password").hide();
      $(this).parent().find(".show-password").show();
    }
  });
});

li {
  list-style: none
}

.hide-password {
  display: none
}

  

    
    
Show
    hide
    
    

      

        
        
Show
        hide