JSFiddle - React, Tailwind, and code Playground

HTML

<div id="contenteditable" contenteditable></div>

CSS

#contenteditable {
    min-height: 100px;
    background-color: lightgray;
}

JavaScript

var contenteditable = document.getElementById("contenteditable");
var insert = document.getElementById("insert");

contenteditable.onkeyup = function(e) {
    contenteditable.innerHTML += '<div id="startHere">Start Here</div>';
    
    /* find start div */
    var startHereDiv = findStartHereDiv(contenteditable);
    
    /* select text */
    selectText(startHereDiv.id);    
}

function findStartHereDiv(contenteditable) {
    var childNodes = contenteditable.childNodes;
    for(var i = 0; i < childNodes.length; i++) {
        if(childNodes[i].id == 'startHere') {
            return childNodes[i];
            break;
        }
    }
   return null; 
}

function selectText(element) {
    var doc = document
        , text = doc.getElementById(element)
        , range, selection
    ;    
    if (doc.body.createTextRange) {
        range = document.body.createTextRange();
        range.moveToElementText(text);
        range.select();
    } else if (window.getSelection) {
        selection = window.getSelection();        
        range = document.createRange();
        range.selectNodeContents(text);
        selection.removeAllRanges();
        selection.addRange(range);
    }
}