Is there a way to style every second div with the class .event-date inside the .upcome-events div differently? I want to give all even-numbered divs with the class .event-date a unique background color compared to the other divs. I attempted to achieve this using the following CSS:
.upcome-events .event-date:nth-child(even) {
background-color: #000;
}
This is my HTML structure:
<div class="upcome-events box">
<h4></h4>
<div class="event clearfix">
<div class="event-date">
<h3></h3>
<p></p>
</div>
<div class="event-desc">
<p></p>
<p></p>
</div>
</div>
<div class="event clearfix">
<div class="event-date">
<h3></h3>
<p></p>
</div>
<div class="event-desc">
<p></p>
<p></p>
</div>
</div>
<div class="event clearfix">
<div class="event-date">
<h3></h3>
<p></p>
</div>
<div class="event-desc">
<p></p>
<p></p>
</div>
</div>
<div class="event clearfix">
<div class="event-date">
<h3></h3>
<p></p>
</div>
<div class="event-desc">
<p></p>
<p></p>
</div>
</div>
</div>
Unfortunately, the above code doesn't seem to be working as expected for me. Any suggestions on how to make it work?