JSFiddle - React, Tailwind, and code Playground

HTML

<div contenteditable="true">
    <ul>
        <li>List 1</li>
    </ul>
</div>

CSS

div{
    width: 300px;
    height: 300px;
    border: 1px solid green;
}
div > div, div > p{
 	border: none;
    width: auto;
    height: auto;
}
div > div:after, div > p:after{
    content: "div or p generated that does not belong here";
    background: gray;
}
ul{
    list-style-type:square;
    padding-left: 32px;
}

JavaScript

function nodeSelection() {
			var target = null;
			target = window.getSelection().getRangeAt(0).commonAncestorContainer;
			target = (target.nodeType === 1) ? $(target) : $(target.parentNode);
			return target;
		}

$(document).ready(function(){
 				$("div").keypress(function(evt) { 
				    var sel, range, br, addedBr = false;
				    var charCode = evt.which || evt.keyCode;
				    var target = nodeSelection();
				    console.log(target);
				    var ignoreEnter = target.is("li") && target.html() != "<br>";
				    if (charCode == 13 && !ignoreEnter) {
				        if (typeof window.getSelection != "undefined") {
				            sel = window.getSelection();
				            if (sel.getRangeAt && sel.rangeCount) {
				                range = sel.getRangeAt(0);
				                range.deleteContents();
				                br = document.createElement("br");
				                range.insertNode(br);
				                range.setEndAfter(br);
				                range.setStartAfter(br);
				                sel.removeAllRanges();
				                sel.addRange(range);
				                addedBr = true;
				            }
				        } else if (typeof document.selection != "undefined") {
				            sel = document.selection;
				            if (sel.createRange) {
				                range = sel.createRange();
				                range.pasteHTML("<br>");
				                range.select();
				                addedBr = true;
				            }
				        }

				        // If successful, prevent the browser's default handling of the keypress
				        if (addedBr) {
				            if (typeof evt.preventDefault != "undefined") {
				                evt.preventDefault();
				            } else {
				                evt.returnValue = false;
				            }
				        }
				    }
			    });
});