子选择器没有按预期工作，有什么问题？

Question

我有一个无序列表，我希望样式只针对直接的“li”元素，这就是为什么我使用“＆gt;”儿童选择器。

但是发生的事情是，甚至嵌套在“ul”元素内的“li”元素也会被设置为第一级“li”元素，这里有什么问题？

这是CSS，

#nav > li {
    background-color: yellow;}

这是我的标记。

<div>
  <ul id="nav">
   <li>This is a list</li>
   <li>This is a list</li>
   <li>
    <ul>
     <li>This is a list</li>
     <li>This is a list</li>
    </ul>
   </li>
  </ul>
</div>

感谢任何帮助，谢谢。