table nth-child tester

HTML

<div class="parent">
  <!-- red -->
  <p>Jane</p>
  <div class="child">
    <!-- blue -->
    <p>Jim</p>
     <div class="grandchild">
      <!-- green -->
      <p>Aaron</p>
      <div class="greatgrandchild">
        <!-- pink -->
        <p>Victoria</p>
      </div>
      <div class="greatgrandchild greatgrandchild2">
         <!-- purple -->
         <p>Devin</p>
      </div><!-- grandchild2 -->
    </div><!-- grandchild -->
  </div><!-- child -->
  
  <div class="child child2">
    <!-- coral -->
    <p>Susan</p>
    <div class="grandchild">
      <!-- aqua -->
      <p>George</p>
      <div class="greatgrandchild">
        <!-- rosybrown -->
        <p>Julie</p>
      </div>
    </div>
    <div class="grandchild grandchild2">
      <!-- sienna -->
      <p>Nancy</p>
      <div class="greatgrandchild">
        <!-- tomato -->
        <p>Bob</p>
      </div>
    </div><!-- grandchild -->
  </div>
</div><!-- parent -->

CSS

.parent {
  color: red;
}

.child {
  color: blue;
}

.grandchild {
  color: green;
}

.greatgrandchild {
  color: pink;
}

.greatgrandchild2 {
  color: purple;
}

.child2 {
  color: coral;
}

.child2 .grandchild {
  color: aqua;
}

.child2 .greatgrandchild {
  color: rosybrown;
}

.child2 .grandchild2 {
  color: sienna;
}

.child2 .grandchild2 .greatgrandchild {
  color: tomato;
}