How can I get the last descendant element using jQuery?

Question

OK, this should be super low hanging fruit.

I'm aware of .last() and yet for some reason my copy of jquery-min (version 1.4.2) is returning a .last is not a function() error when I call $('form#demo td').last() on the following markup:

<form id="demo">
  <tr>
    <td>1</td>
    <td>2</td>
    <td class="action">3</td>
  </tr>
</form>

even though a call to $('form#demo td') returns

[td, td, td.action]

at the firebug console in Firefox 3.5.5.

What am I missing?

Answer 1

use $('form#demo td:last') instead.

the way you were doing it just returns an array, and jquery doesn't seem to define last() for arrays. You're right that it's in the jQuery api docs, but I've personally never gotten it to work that way.

Answer 2

try

$('form#demo td:last')

edit:

I think your problem is you got a broken html structure there...

I tested your code and got the error... but got it fixed by getting the correct structure..

here is a demo