jquery DOM accessing parent element

Question

I need to access to tr element in table.

I have 3 colums and in last column have checkbox. In event on change I have code:

alert( $(this).parent().parent().html() );

Which get all 3 td elements, but I need it with tr parent tag.

I tried:

alert( $(this).parent().parent().parent().html() );

alert( $(this).parent().parent().prev().html() );

And doesn't work.

HTML:

<table>
   <thead bgcolor="#668c41">
      <tr>
         <th>App</th>
         <th>Server</th>
         <th>Action</th>
      </tr>
   </thead>
   <tbody id="dialog-app">
      <tr>
         <td>appA</td>
         <td>serverA</td>
         <td><input checked="" type="checkbox"></td>
      </tr>
   </tbody>
</table>

possible duplicate of [jQuery: outer html()](http://stackoverflow.com/questions/5744207/jquery-outer-html) — Douglas, Mar 26 '14 at 08:23

score 4 · Accepted Answer · answered Mar 26 '14 at 08:22

4

Try to use .closest() instead:

alert( $(this).closest('tr').html() );

If you want the outer HTML which is your closest tr element as well, then you can do:

alert($(this).closest('tr')[0].outerHTML)

answered Mar 26 '14 at 08:22

Felix

37,892
8
43
55

score 1 · Answer 2 · answered Mar 26 '14 at 08:23

1

if you want to reach the closest enclosing tr , you can use closest()

$(this).closest('tr')[0].outerHTML // to get html including the tr

----> http://api.jquery.com/closest/

answered Mar 26 '14 at 08:23

Adil Shaikh

44,509
17
89
111

jquery DOM accessing parent element

2 Answers2