I am puzzled by the fact that the letter H is not displaying in red, while D E F are showing up as red.
Shouldn't the CSS path for H be .pages > li > ul > li ?
What I have observed is that if I remove G or change the tag of G to something else, like a <p>, then H shows up in red;
.sitemap li {
color: teal;
}
.pages > li > ul > li {
color: red
} <aside class="sitemap">
<ul class="pages">
<li>A</li>
<li>B</li>
<li>C
<ul>
<li>D</li>
<li class="featured">E</li>
<li>F</li>
</ul>
<li>G</li>
<ul>
<li>H
<ul>
<li class="featured">I</li>
<li>J</li>
</ul>
</li>
</ul>
</li>
</ul>
</aside>