Multiple paragraph selection incorrect, to be changed using the node method (javascirpt / node html)

I'm having problems running an action on more than one line, in practice I do not get the desired effect and <p> tags are completely emptied of their content. This is the simple code I use, but it only works on a line:

var r = window.getSelection().getRangeAt(0),
selectedText = r.toString(),
content = r.extractContents();
span = document.createElement('span'),
t = document.createTextNode(selectedText);
selectedText = '';
span.style.color = 'green';
span.appendChild(t);
r.insertNode(span);

Try to look at code in action HERE . Follow the instructions in the example to understand the real problem. Thank you!!!

via User