无法将光标设置为在<br>标记之前

Question

我正在构建表情符号系统，单击表情符号时需要将光标移到内容可编辑的结尾。

HTML：

<div class="emoji-editor" tabindex="0" spellcheck="false" contenteditable="true"></div>

我使用的JS函数：

function setCursorToEnd( contentEditableElement ) {

    contentEditableElement.focus();
    var range, selection;
    if ( document.createRange ) {
        range = document.createRange();
        range.selectNodeContents( contentEditableElement.get( 0 ) );
        range.collapse( false );
        selection = window.getSelection();
        selection.removeAllRanges();
        selection.addRange( range );
    } else if ( document.selection ) {
        range = document.body.createTextRange();
        range.moveToElementText( contentEditableElement.get( 0 ) );
        range.collapse( false );
        range.select();
    }
}

工作正常，但问题是它在<br>标记后添加了表情符号，这是因为该函数将光标移动到contentEditable标记的末尾而不是contentEditable标记文本的末尾。 / p>

如何解决这个问题？