JSFiddle - React, Tailwind, and code Playground

by borisjavier

HTML

<div id="testo">
<span id="text"  onclick="clickHandler(this);">awesome</span><br>
<span id="text1" onclick="clickHandler(this);">terrifying</span><br>
<span id="text2"  onclick="clickHandler(this);">elegant</span><br>
</div><br><br>

CSS

.pb-chat-panel {
        border: none;
        margin-bottom: -5px;
    }

    .pb-chat-panel-heading {
        margin-top: -5px;
    }

    .pb-chat-top-icons {
        margin-top: 4px;
    }

    #support_label {
        color: #999;
    }

    .pb-chat-labels {
        font-size: 15px;
    }

    .pb-chat-labels-right {
        margin-bottom: 0;
        margin-right: 5px;
    }


    .pb-chat-labels-left {
        margin-left: 5px;
    }

    .pb-chat-labels-primary {
        margin-right: 5px;
    }

    .pb-chat-fa-user {
        border: 1px solid blue;
        padding: 5px;
        border-radius: 50%;
    }

    .pb-chat-textarea {
        resize: none;
    }

    .pb-chat-dropdown {
        width: 300px;
    }

    .pb-chat-btn-circle {
        border-radius: 35px;
    }

    .pb-btn-circle-div {
        padding-left: 0px;
        margin-top: 12px;
    }

JavaScript

function clickHandler(object) {
    alert('Dirección ' + object.innerText + ' copiado');
 		CopyToClipboard(object.id);
}
   function CopyToClipboard(id)
{
var r = document.createRange();
r.selectNode(document.getElementById(id));
window.getSelection().removeAllRanges();
window.getSelection().addRange(r);
document.execCommand('copy');
window.getSelection().removeAllRanges();
}