CSS Первый элемент, который не имеет класса

У меня есть несколько элементов списка, первый из которых содержит класс, а через некоторое время - несколько. Withh CSS, я бы хотел выбрать первый элемент в списке, который не имеет признанного класса...

Код выглядит следующим образом:

<ul>
<li class="featured"></li>
<li class="featured"></li>
<li></li>
<li></li>
<li></li>
</ul>

Я пробовал следующее без эффекта:

ul li:not(.featured):first-child {
  /* Do some stuff here */
}

Любые идеи о том, как это сделать, не прибегая к jQuery?

UPDATE Способность существует, чтобы добавить классы, отличные от объектов, если это поможет. Например:

<ul>
<li class="listing featured"></li>
<li class="listing featured"></li>
<li class="listing"></li>
<li class="listing"></li>
<li class="listing"></li>
</ul>

Ответы

li.featured + li:not([class="featured"])

ul .featured + li {
    /* some styles */
}

ul li.featured {
    /* some styles */
}