Выбор класса и первых трех остальных; nth-child и nth-of-type бесполезны

У меня есть элемент DOM (#installations) с несколькими дочерними элементами, только один из у них есть класс .selected. Мне нужно выбрать этот класс и первые 3 из остальных (: not (.selected)) и показать их - цель состоит в том, чтобы отобразить только 4 элемента, независимо от того, какой элемент имеет класс .selected.

Проблема заключается в выражении:

#installations > *:not(.selected):nth-of-type(-n+3), .selected

: nth-of-type () игнорирует селектор: not () и просто выбирает первые 3 дочерних элемента #installation. Например, если у меня есть этот HTML:

<div id="installations">
    <div id="one"/>
    <div id="two"/>
    <div id="three" class="selected"/>
    <div id="four"/>
    <div id="five"/>
</div>

, я выберу только один, два, три, а не первые четыре. Логическим выводом является то, что: nth-of-type () будет иметь только (один, два, четыре, пять) для выбора, поскольку: not () уже исключил выбранный, таким образом выбрав (один, два, четыре), а затем другая часть селектора .selected добавит выбранный элемент.

Если .selected отсутствует в первых четырех элементах, скажем, это шестой, у нас будут выбраны первые три + шестой элементы.

Чтобы уточнить: выбор .selected плюс 3 смежных элемента тоже подойдет. Впрочем, мне это тоже сложно.selected находится в последних 3 (если мы выберем следующие 3 соседних элемента)