JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
<select id="myselect">
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
</select>

<div id="myeditor" contenteditable="true">
    <p>Line one.</p>
    <p>Line two.</p>
</div>

CSS

#myeditor {
    width:100%;
    height:200px;
    margin-top:5em;
}

JavaScript

$.ui.selectmenu.prototype._setSelection = function( ) {
    var selection;
    
    if ( !this.range ) {
        return;
    }
    
    if ( window.getSelection ) {
        selection = window.getSelection();
        selection.removeAllRanges();
        selection.addRange( this.range );
    } else {
        // support: IE8
        this.range.select();
        
        // support: IE
        // Setting the text selection kills the button focus in IE, but
        // restoring the focus doesn't kill the selection.
        this.button.focus();
    }
};
$( '#myselect' ).selectmenu( );