Get Cursor position in Edittable span

Question

I have editable span i want to add text on cursor position on button click. This span have multi line value and html tag.

[Link](http://jsfiddle.net/8txz9sjs/)

Answer 1

Use Range.insertNode():

$('button').click(function() {
  var range= getSelection().getRangeAt(0),
      text= document.createTextNode('NEW TEXT');
  range.insertNode(text);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='div_template' contenteditable="true">
    asdf asfd asd
 asdf 
    asdf asdf asdf asdf asdf asdf<br/>
adf asfd asdf  sdafasdf
 asdf asdf asd    
</div>
<button>Set Text</button>