Question

I am trying to replace password textboxes with regular textboxes once the password has been entered. This code works only if the very first password textbox is not empty but then it also performs the code on every password textbox.

if ($('input[type=password]').val() != "") {
                    $('input[type=password]').hide(); 
                    $('input[class=showPswd]').show(); 
                }

I thought something like this would work but it is not.

if ($('input[type=password]').val() != "") {
                        $(this).find('input[type=password]').hide(); 
                        $(this).find('input[class=showPswd]').show(); 
                    }

How do I get the code to look at each password textbox and replace only that textbox when it is empty?

Thanks

EDIT: This is the general layout. There are more rows that are almost identical.

                <td class="style1">
                    QA :</td>
                <td class="style2">
                <asp:DropDownList ID="DropDownList4" runat="server">                   
                    </asp:DropDownList>
                    </td>

                <td style="vertical-align:middle">
                    <asp:TextBox ID="TextBox4" runat="server" textmode="Password"></asp:TextBox>
                        <asp:TextBox ID="TextBox21" runat="server" style="display:none;" class="showPswd" value="Accepted"></asp:TextBox>

                    <asp:Label ID="Label4" runat="server" Text=""
                    ></asp:Label>
                    </td>                
            </tr>

Answer 1

make use of each() function , to do the operation on each textbox having type password like as below

    $('input[type=password]').each(
    function ()
    {
    if ($(this).val() != "")  
     { 
              $(this).hide(); 

              //just replace this line as you need not sure what is does 
              //$(this).find('input[class=showPswd]').show();
     } 

  });