Дочерний селектор, использующий `querySelectorAll` для коллекции DOM

Предположим, у вас есть список с вложенными дочерними списками.

<ul>
    <li></li>
    <li>
        <ul>
            <li></li>
            <li></li>
        </ul>
    </li>
    <li></li>
</ul>

И используйте document.querySelectorAll()для выбора:

var ul = document.querySelectorAll("ul");

Как я могу использовать коллекцию ulдля получения прямых дочерних элементов?

ul.querySelectorAll("> li"); 
// Gives 'Error: An invalid or illegal string was specified'

Давайте предположим, что ulкаким-то образом кэшируется, (иначе я мог бы сделать ul > liнапрямую).

В jQuery это работает :

$("ul").find("> li");

, но не в нативном querySelectorAll. Любые решения?