Insert text after specific character?
<p>Is it possible to insert a <code>div</code> after a certain amount of characters in a paragraph of text?</p>

<p>If I have a <code>div</code> full of text, like so:</p>

<pre><code>&lt;div class="content"&gt;
Vivamus luctus urna sed urna ultricies ac tempor dui sagittis.
&lt;/div&gt;
</code></pre>

<p>And I want to insert a <code>div</code> after the 13th character:</p>

<pre><code>Vivamus luctu&lt;div&gt;s urna sed urna ultricies ac tempor dui sagittis
</code></pre>

<p>Can I do this with jQuery/Javascript?</p>

<p>I am receiving the bounds for where I want to insert a <code>div</code> from <code>getSelection().extentOffset</code> which results in a number, say <code>13</code> which is where I want to insert the <code>div</code>.</p>

<p>I was able to get this to partially work, like so:</p>

<pre><code>$("div").on("mouseup", function () {
    var start = window.getSelection().anchorOffset;
    var end = window.getSelection().extentOffset;
    console.log(start + ", " + end);
    console.log($(".content").text().substring(start, end));
    $('.output').html($('.content').html().substring(0, start) + '&lt;span class="highlight"&gt;' + $('.content').html().substring(start, end) + "&lt;/span&gt;" + $('.content').html().substring(end));
});
</code></pre>

<p>But that replaces the entire text when the bounds change, meaning that there can't be more than one section wrapped in a <code>div</code>.</p>
