Inserindo uma sequencia de html após um elemento

aí, galera. é o seguinte.

Tenho a seguinte estrutura em um html.

<div id="principal">
 <span id="span_refresh">atualizar</span>
 <span id="span_mark_all">marcar todos como lidos</span>
 <span id="span_exit">sair</span>
</div>
Eu quero inserir via javascript (dinamicamente) **<span id="span_font_mais">A+</span>** exatamente após o segundo SPAN (span_mark_all).

Nesse caso, como eu faria isso?

* Detalhe, eu não tenho acesso à alterar o código html da página, pois não é minha. Eu estou tentando fazer tipo um daqueles bookmarklets mas esbarrei nessa parte do código.