JSFiddle - React, Tailwind, and code Playground

by SimenB

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/ui-darkness/jquery-ui.min.css">
<div id="wrapper">
    <div id="text">Some text to be highlighted</div>
</div>

JavaScript

var markDialog = function () {
    mark($('#text')[0]);
}

var mark = function (el) {
    var range, selection;

    if (document.body.createTextRange) {
        range = document.body.createTextRange();
        range.moveToElementText(el);
        range.select();
    } else if (window.getSelection) {
        selection = window.getSelection();
        range = document.createRange();
        range.selectNodeContents(el);
        selection.removeAllRanges();
        selection.addRange(range);
    }
}

$('#wrapper').dialog({
    buttons: {
        Mark: markDialog        
    },
    modal: true
});