Заменить все угловые скобки, пропуская теги с определённым классом JavaScript RegExp

Необходимо заменить все угловые скобки на их html-entities обёрнутые в тег, но при этом пропустить сами теги. Пример:

<span class="highlight word">some text</span>
<span class="another classes">some stuff here</span>
<
>
<
<<<

Желаемый результат:

<span class="highlight word">some text</span>
<span class="highlight brace">&lt;</span>span class="another classes"<span class="highlight brace">&gt;</span>some stuff here<span class="highlight brace">&lt;</span>/span<span class="highlight brace">&gt;</span>
<span class="highlight brace">&lt;</span>
<span class="highlight brace">&gt;</span>
<span class="highlight brace">&lt;</span>
<span class="highlight brace">&lt;</span><span class="highlight brace">&lt;</span><span class="highlight brace">&lt;</span>

Думаю, понятно...

Что я пытался делать: Сперва хочу левую скобку заменить регулярным выражением, но похоже у меня нет достаточного их понимания, к моему сожлению. Что у меня есть:

<(?!span class='highlight.*?'>.*?<\/span>)

Но оно всё равно находит < в закрывающем теге и результат работы .replace() получается:

<span class="highlight word">some text<span class="highlight brace">&lt;</span>/span>

В этом и проблема и решить её пока не получилось.