The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Target last li item groups of class "test" within ul

  • This topic is empty.
Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
  • #249633

    Hey guys, I wanna target the last li of class “test” within an ul, for example

       <li class="test">1</li> <-- I want to target this guy
      <li class="test">4</li> <-- And this guy
      <li class="test">2</li>
      <li class="test">3</li> <-- And this one over here

    Can this be done with CSS only? if not how can i target em with JS


    Sorry, edited – I was misunderstanding…


    I don’t know if I get it either, there seems to be a discrepancy between question and code example.


    I believe now it is about each last occurrence of .test in any sequence of one or more…

    Not that I can think of a CSS approach by the way.


    You are right, is the last occurrence of each .test class on all list items, so what would be a good JS approach to target them? Thanks in advance 4 helping


    Can it be using jQuery or would it have to be some code of the vanilla kind?


    I might use jQuery to solve this, the thing is I would like to matain the structure in Wich I keep all my items on li tags and add a class to know Wich ones are the last item with the class test when the next one doesn’t have it, thanks again 4 sharing this problem with me :)


    No problem, here’s a little something:


    Stupid question: couldn’t you just add an ID to those target choices and style that?


    This is a non-trivial issue.

    There is no single method for selection here. There are multiple conditions that need to be resolved.

    Is the item preceded by a .test, followed by a .test etc.

    Frankly, you’re gonna have several/multiple/nested if statements….it would probably be easier to refactor your HTML


    Nop, the list items are auto generated


    jQuery .last() could do it:


Viewing 12 posts - 1 through 12 (of 12 total)
  • The forum ‘CSS’ is closed to new topics and replies.