我有以下标记：

<div class="foo">
    <ul>
        <li>one</li>
        <li>two</li>
    </ul>
    <ul>
        <li>three</li>
    </ul>
    <ul>
        <li>four</li>
    </ul>
</div>

我希望将样式设置为“一个”和“三个”。

但是，标记也可以是：

<div class="foo">
    <ul>
        <li>one</li>
        <li>two</li>
        <li>three</li>
    </ul>
    <ul>
        <li>four</li>
    </ul>
</div>

我尝试使用以下CSS：

.foo li:nth-child(1),
.foo li:nth-child(3)
{
    color:red;
}

但是，正如预期的那样，这是每个样式的第一个子元素的样式ul。

如何更改CSS，以便可以定位li属于的第1个和第3个.foo？