When Range Selection expands to parent elements, it creates extra elements if either side of the selection was in the middle of a tag
<p>Code: <a href="http://jsfiddle.net/DerNalia/9vHK4/2/" rel="nofollow">http://jsfiddle.net/DerNalia/9vHK4/2/</a><br>
Version showing: the selected html as text (expanded): <a href="http://jsfiddle.net/DerNalia/Wnd3j/" rel="nofollow">http://jsfiddle.net/DerNalia/Wnd3j/</a></p>

<p>So, when I do a Selection like this:</p>

<p><img src="http://i.stack.imgur.com/gp14q.png" alt="enter image description here"></p>

<p>My code generates a "highlight" like this:</p>

<p><img src="http://i.stack.imgur.com/bEwhs.png" alt="enter image description here"></p>

<p>Notice how it added an empty <code>&lt;li&gt;</code> before and after the selection.</p>

<p>What it should have done is completely surround the 6,7, 8 pool <code>&lt;li&gt;</code>'s with the selection span. </p>

<p>Here is the code handeling selection expansion:</p>

<pre><code>TBR.Selection.get_HTML_from_range = function(range, sel){
var startEl = sel.anchorNode;
var endEl = sel.focusNode;

if (startEl != endEl){
        if (startEl != range.commonAncestorContainer) {
        while (startEl.parentNode != range.commonAncestorContainer) {
            startEl = startEl.parentNode;
        }
    }
    if (endEl != range.commonAncestorContainer) {
        while (endEl.parentNode != range.commonAncestorContainer) {
            endEl = endEl.parentNode;
        }
    }
        range.setStartBefore(startEl);
        range.setEndAfter(endEl);
    }
sel.addRange(range);

var container = document.createElement("span");
container.appendChild(sel.getRangeAt(0).cloneContents());

html = container.innerHTML;

    if (html.length &lt; MINIMUM_SELECTION_LENGTH) {return false;}
    return html;
}
</code></pre>

<p>basically if the start and end of the selection are on different DOM nodes, then the selection needs to expand such that the selection contains no broken DOM elements (all tags much have a matching end tag, etc)
But I have a feeling that the selection is breaking the HTML, and the browser is repairing the HTML before the selection expands all the way. I'm not sure.</p>
