Forums

Add Class to Every Other Item in List

Permalink
I need to add a class to every other LI tag in a list, so it is applied to even numbered items only. Below is the code I have now for displaying each item.

<ol class="timeline-<?php echo $layout ?>">
            <?php foreach ($rows as $row) {  ?>
                <li>
               <div class="border-line"></div>
               <div class="timeline-description">
                  <h3><?php echo $row['title'] ?></h3>
                  <?php echo $row['liContent'] ?>
               </div>
            </li>
                <?php $eztEntryCount++;
            } ?>
        </ol>

How do I make it so that a class is added to every other item (all even numbers)?
PineCreativeLabs
 
Steevb replied on at Permalink Reply
Steevb
Have you css and the ':nth-child'?
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
That occurred to me, but it won't work due to the nature of the block I'm working on. Basically, the resulting code will be something like this: 

<ol>
<li>Item 1</li>
<li class="fluffynuggins">Item 2</li>
<li>Item 3</li>
<li class="fluffynuggins">Item 4</li>
<li>Item 5</li>
...
</ol>
PineCreativeLabs replied on at Permalink Reply
PineCreativeLabs
Ok, looks like I found a simple solution using CSS.

I did this: 
ol li:nth-of-type(2n) { styles... }


That works just fine as it applies the styles to all even-numbered items.

This website stores cookies on your computer. These cookies are used to improve your website experience and provide more personalized services to you, both on this website and through other media. To find out more about the cookies we use, see our Privacy Policy.