Begin by acknowledging that I am familiar with the concept of nth-child
, but it seems that it will not be effective in my specific case. Consider the following HTML:
<div>
<div class="myclass">test1</div>
</div>
<div>
<div class="myclass">test2</div>
</div>
<div>
<div class="myclass">test3</div>
</div>
Now, I aim to highlight the div containing test2
. It is evident that using .myclass:nth-child(2)
will not produce the desired result as it searches for the second child instance of myclass
, which are all first children. The failure of this approach can be observed here.
Consequently, how would one go about selecting the second occurrence of myclass
in the given example solely utilizing CSS3? Note that javascript/jquery cannot be employed.