如何对指定的子元素进行样式改变？

比如<ul class="food">
    <li>水果
        <ol class="frut">
            <li>香蕉</li>
            <li>苹果</li>
            <li>梨</li>
        </ol>
    </li>
    <li>蔬菜
        <ul>
            <li>白菜</li>
            <li>油菜</li>
            <li>卷心菜</li>
        </ul>
    </li>
</ul>

我要对上面的子元素就单单白菜字样变红，这要怎么办呢