Regex для замены текста между (снаружи) двумя тегами

Question

Я пытаюсь использовать некоторое регулярное выражение для переноса слова "или" в тег <span> в некоторой разметке.

<div id="test">
  <a href="#" class="thickbox open-details-modal" aria-label="View version 1.5.29 details">View version 1.5.29 details</a> or <a href="#" class="update-link" aria-label="Update now">update now</a>
</div>

<div id="result"></div>

var html = $( '#test' ).html();

html = html.replace( /(<\/a>[\s\S]*?<a)/, "<\/a><span class='or'>$1<\/span><a href" );

$( '#result' ).html( html );

Полученная разметка выглядит немного странно:

<div id="result">
  <a href="#" class="thickbox open-details-modal" aria-label="View version 1.5.29 details">View version 1.5.29 details</a><span class="or"> or <a< span=""><a href="" class="update-link" aria-label="Update now">update now</a>
</a<></span></div>

Результат вкладывает второй элемент <a> inside of the `. Кажется, я не могу понять, почему он так странно вкладывает.

<span class="or"> or <a< span=""><a href="" class="update-link" aria-label="Update now">update now</a>
</a<></span>

У меня есть скрипка, где я тестировал некоторые вещи здесь: https://jsfiddle.net/qfuLozxw/

Ожидаемые результаты:

<div id="test">
  <a href="#" class="thickbox open-details-modal" aria-label="View version 1.5.29 details">View version 1.5.29 details</a> <span class="or">or</span> <a href="#" class="update-link" aria-label="Update now">update now</a>
</div>

Answer 1

Содержимое, указанное в скобках, - это то, что возвращается в переменной $1. Вам просто нужно содержать текст, который вы хотите заменить:

html = html.replace( /<\/a>( or )<a/, "<\/a><span class='or'>$1</span><a" );

Или, если вы хотите сопоставить любое слово между ссылками:

html = html.replace( /<\/a>( \w* )<a/, "</a><span class='or'>$1</span><a" );

Пример здесь: https://jsfiddle.net/wbard38q/