JSFiddle - React, Tailwind, and code Playground

HTML

<DIV class="peCont" contenteditable="true">Text goes here along with <b>some <i>HTML</i> tags</b>.</DIV>
<a href="#">test</a>
<p></p>

JavaScript

function getCaretPosition(editableDiv) {
    var caretPos = 0, containerEl = null, sel, range;
    sel = window.getSelection();
        if (sel.rangeCount) {
            range = sel.getRangeAt(0);
            if (range.commonAncestorContainer.parentNode == editableDiv) {
                caretPos = range.endOffset;
            }
        }
    
    return caretPos;
}

$('.peCont').bind('keyup mouseup', function() { 
    $("p").html(getCaretPosition(this));
});