Eu gostaria de pintar os terceiros elementos de azul, como mostrado no curso.

Segue o código, alguém poderia me ajudar onde está o erro.

<div class="grid">

  <!-- primeira linha -->
  <div class="course">a</div>
  <div class="course">b</div>
  <div class="course">c</div>

  <!-- segunda linha -->
  <div class="course">d</div>
  <div class="course">e</div>
  <div class="course">f</div>

  <!-- terceira linha -->
  <div class="course">g</div>
  <div class="course">h</div>
  <div class="course">i</div>

  <!-- quarta linha -->
  <div class="course">j</div>
  <div class="course">l</div>

</div>

.grid {
  display: flex;
  flex-wrap: wrap;
}

.course {
  background-color: red;
  text-align: center;
  width: 31.3%;
  margin: 1%;
}

.course:nth-child(3h) {
    background-color: red;
}