<div class="lista1">
  <ul>
    <li>1</li>
    <p>1</p>
    <li>2</li>
     <p>2</p>
    <li>3</li>
    <p>3</p>
    <li>4</li>
     <p>4</p>
  </ul> 
</div>
<div class="lista2">
  <ul>
    <li>1</li>
    <p>1</p>
    <li>2</li>
     <p>2</p>
    <li>3</li>
    <p>3</p>
    <li>4</li>
     <p>4</p>
  </ul> 
</div>
 
ul li, ol li, p {
  display: inline-block;
  width: 50px; 
  background-color: #f7f7f7;
  border: solid 1px #ccc;
  padding: 10px;
  margin: 5px; 
}
 

.lista1 li:nth-child(odd) { 
  background-color: #FFD986; 
}

.lista2 li:nth-of-type(odd) {
   background-color: red; 
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.