[SOLVED] Is there a way to dynamically add a "last" class to the last post appearing in a Tumblr tag page?

Is there a way to dynamically add a "last" class to the last post appearing in a Tumblr tag page?

I was wondering whether it is possible to add a "last" class to the last post appearing in a tumblr tag page in order to be able to customize it in css?

The goal is the following: let us say that a certain tag has 3 posts, so when I navigate in that tag page, the 3 posts appear, one below the other. I would like the first two separated by a line located at the bottom of each post body, but the last one on the bottom of the page should not have a separation line at its bottom, so I guess I would need a specific class for that post since it is the last one.

Thank you.

Solution

As per my comment you can achieve this by simply using a css selector :last-of-type or :nth-child(last)

Here is an example.

HTML:

<div id="posts">
    <div class="post">
        Post 1
    </div>
    <div class="post">
        Post 2
    </div>
    <div class="post">
        Post 3
    </div>
</div>

CSS:

#posts .post {
    margin-bottom: 20px;
    border-bottom: 2px solid #444;
}
#posts .post:last-of-type {
    background-color: orange;
    border-bottom: none;
}

There is a jsfiddle here: https://jsfiddle.net/lharby/39ap851L/

So each post item will have a border bottom, but for the last post of type we override this with border-bottom: none