JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <div id="text" class="text">test4 test5 test6</div>
    <span id="button">copy 2 from div</span>
</div>

CSS

#text {
    border: 1px solid #000;
    height: 30px;
    margin-bottom: 10px;
}

#button {
    border: 1px solid #DDD;
    background-color: #EEE;
    cursor: pointer;
}

JavaScript

jQuery.fn.getSelectedText = function() {
    var sSelectedText = "";
    // all browsers, except IE before version 9
    if (window.getSelection) {
        var sTagName = this.get(0).tagName.toLowerCase();
        sSelectedText = (
            sTagName == 'input' || sTagName == 'textarea' ?
            this.val().substring (
                this.get(0).selectionStart
                , this.get(0).selectionEnd
            ) :
            document.getSelection().toString()
        );
    } 
    // Internet Explorer before version 9
    else {
        if (document.selection.createRange) {
            sSelectedText = document.selection.createRange().text;
        }
    }
    return sSelectedText;
}

var sSelectedText = '';
$('body').click(function() {
    sSelectedText = $('#text').getSelectedText();
});
$('body').dblclick(function() {
    sSelectedText = $('#text').getSelectedText();
});

$('#button').click(function(e) {
    alert(sSelectedText);
});