previously i checked whether a row is last row in a table like this in a condition:

$row.is(':last-child')

which works fine.

Now, i have a requirement where some of the rows in the table are hidden - now i have to check whether a specific row is the last visible row in the table.

I tried with this:

$row.is(':visible:last-child')

but not that successfull. Does someone have a clue?

previously i checked whether a row is last row in a table like this in a condition:

$row.is(':last-child')

which works fine.

Now, i have a requirement where some of the rows in the table are hidden - now i have to check whether a specific row is the last visible row in the table.

I tried with this:

$row.is(':visible:last-child')

but not that successfull. Does someone have a clue?

• javascript
• jquery
• css
• jquery-selectors
• jquery-traversing

• 1 should work, just like $("#question").is(':visible:last-child') on this page returns false but $("#question").is(':visible:first-child') returns true. How doesn't it work? – st3inn Commented Nov 5, 2012 at 15:27
• I have a strange feeling, but I think he may misunderstand what the :visible selector does. It doesn't check if something is off the page (ie. scrolling). It just sees if something is not hidden on the page. A pure shot in the dark but hey, it might be helpful. – psx Commented Nov 5, 2012 at 16:14

3 Answers 3

This doesn't work because the last-child is display: none;.

One approach is to iterate the childs to find the index of the last visible child (see fiddle) :

var $rows = $('td');
var $rowsReverse = $($rows.get().reverse());

var $lastVisibleIndex = -1;
$rowsReverse.each(function(index) {
    if ($lastVisibleIndex == -1 && $(this).is(':visible')) {
        $lastVisibleIndex = $rowsReverse.length - index - 1;
    }
});

$rows.each(function(index) {
    var $row = $(this);
    if (index == $lastVisibleIndex) {            
        $row.addClass('red');
    }
});​

Thanx everybody for the quick feedback. I could solve it with the following:

$row.parent().find('tr:visible').last().attr('data-id') is $row.attr('data-id')

(it's in a loop)

@falsarella your answer i guess works fine - is a bit plicated, but it works apparently.

You could try

$(element).is(":visible").last();

or

$(element:visible).last();

If that doesn't work, let me know.