add parent to jquery selector

<tr step="step2" optional="true"><td>Gender</td></tr>
<tr step="step2" optional="true">
     <td>
         <asp:RadioButtonList ID="rblGender" runat="server" RepeatDirection="Horizontal">
             <asp:ListItem Text="Female" Value="0"></asp:ListItem>
             <asp:ListItem Text="Male" Value="1"></asp:ListItem>
         </asp:RadioButtonList>
     </td>
</tr>

Both the tr's are hidden initially and when a condition is met I want to show the radio button list and the header for which I have to show both the tr's

I have a reference to the rblGender. How do I sele开发者_运维百科ct all the other elements?

$("#rblGender").parent().parent().prev() selects only the first tr. Do I have to add each element one by one? Or is there a way to add the whole chain at once?

I did not really understand what you mean with headers, but I assume you want to show both rows. You can use .andSelf:

Add the previous set of elements on the stack to the current set.

$("#rblGender").closest('tr').prev().andSelf()

You should also use closest() instead of a parent() chain. It makes it more robust against structural changes (and more readable imho).

How about wrapping the tr elements in a tbody element, and then you only have to navigate to (and hide/show) a single element?

This would be more flexible, because it would allow as many rows as you like to be hidden/shown at the same time.

You will, of course, then need to add some tbody elements to the other rows of the table, but this wouldn't make the markup incorrect in any way.