JSFiddle - React, Tailwind, and code Playground
HTML
<div contentEditable="true" id="div"></div>
JavaScript
/*
* Normal behaviour: Only "2" should be selected
* Bug in Opera: Space before "2" selects too
*/
$(function() {
var el = $("#div");
var _document = el.parents("body").parent().parent()[0];
var _window = _document.defaultView || _document.parentWindow;
//Clear all content
var contents = el.contents();
for ( var i = 0; i < contents.length; i++ ) {
$(contents[i]).remove();
}
//Append to text nodes
el.append($(_document.createTextNode("1 ")));
el.append($(_document.createTextNode("2")));
var rng = _document.createRange();
//After space of first text node
rng.setStart(el.contents()[0],2);
//After 2 of second text node
rng.setEnd(el.contents()[1],1);
var sel = _window.getSelection();
sel.removeAllRanges();
sel.addRange(rng);
});