CSS selector for :last-child in a subset selection

Question

assuming i have a structure like this (and can't modify it):

<ul>
    <li class="common">   <p>First A</p>   </li>
    <li class="common">   <p>Second A</p>   </li>
    <li class="common">   <p>Third A</p> </li>
    <li class="common">   <p><b>SELECT ME</b></p>   </li>
    <li>   <p>First B</p>   </li>
    <li>   <p>Second B</p>   </li>
    <li>   <p>...</p>   </li>
</ul>

Is there a way to select the last element with class "common"? (in this case the fourth element)

First i tried selecting a subset with:

.common{
    background: red;
}

and it worked correctly. So i tried selecting last-child of them, with:

.common:last-child{
    background: green;
}

but not luck. i also would like to avoid adding a class for that element.

Jsfiddle

EDIT: i simplified classes and selectors to make it cleaner

Answer 1

Is there a way to select the last element with class "common"?

No, not with a CSS selector without modifying the HTML.