get last item of a specific class in markup

Question

I would like to know how I can find the last item of a specific class inside the markup.

<body>
    <elem class="thatelement"></elem>
    <elem></elem>
    <elem class="thatelement"></elem>
    <elem>
        <elem class="thatelement"></elem>
    </elem>
</body>

I want to find the last element of .thatelement in the markup whether it is a directive body child or located elsewhere in nested elements. And please provide me if its crossbrowser working.

You would have to use JavaScript (or jQuery etc). With just CSS selectors selecting the last element with a specific class is not possible. — Harry, Sep 19 '14 at 16:26
@SalmanA this is just an example, the selected element should be the last element with a specific class in any markup! — supersize, Sep 19 '14 at 16:34
AFAIK there is no CSS selector/combinator/trick for selecting the last element of its class. `jQuery(".thatelement:last")` should do the trick though. — Salman A, Sep 19 '14 at 16:36
[Here](http://jsfiddle.net/aajrzLv6/) is a sample using jQuery (same as what Salman A has mentioned above). — Harry, Sep 19 '14 at 16:38
thanks guys, guess thats fine for me. Could you make an answer, I will accept! — supersize, Sep 19 '14 at 16:41

score 0 · Answer 1 · answered Sep 19 '14 at 19:11

You could use Jquery, the last() function will do the work.

HTML

<body>
    <elem class="thatelement">1</elem>
    <elem>2</elem>
    <elem class="thatelement">3</elem>
    <elem>
        <elem class="thatelement">4</elem>
    </elem>
</body>

Jquery

$( ".thatelement" ).last().css( "color", "red" );

I made a jsfiddle so you can view the behavior. The last() function documentation can be found here

get last item of a specific class in markup

1 Answers1