选择直到符合条件的插入符号

Question

我正在使用我设为contenteditable的div。当我写一些像

的东西

foo
bar

  baz1baz2

并使用javascript设置一些颜色，其innerHTML就像：

<div>foo</div>
<div>bar</div>
<div></div>
<div>&nbsp;&nbsp;<span style="color: red">baz1</span>baz2</div>

如果我将插入符号放在baz1的中心，如何从开头到插入符号，或者在这种情况下：

<div>foo</div>
<div>bar</div>
<div></div>
<div>&nbsp;&nbsp;<span style="color: red">ba</span></div>

修改

Contenteditable - extract text from caret to end of element似乎是一种可能的解决方案，但它不起作用。提供的jsFiddle示例也被破坏了。