JSFiddle - React, Tailwind, and code Playground

by joshmoto

HTML

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.6.1/clipboard.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script>
I like big butts <a id="copy_1" data-clipboard-text="and I cannot lie 1" class="copy-link" data-toggle="tooltip"  title="Copy to clipboard" href="#">copy link</a><br/>
I like big butts <a id="copy_2" data-clipboard-text="and I cannot lie 2" class="copy-link" data-toggle="tooltip"  title="Copy to clipboard" href="#">copy link</a><br/>
I like big butts <a id="copy_3" data-clipboard-text="and I cannot lie 3" class="copy-link" data-toggle="tooltip" title="Copy to clipboard" href="#">copy link</a><br/>
I like big butts <a id="copy_4" data-clipboard-text="and I cannot lie 4" class="copy-link" data-toggle="tooltip" title="Copy to clipboard" href="#">copy link</a><br/>
I like big butts <a id="copy_5" data-clipboard-text="and I cannot lie 5" class="copy-link" data-toggle="tooltip" title="Copy to clipboard" href="#">copy link</a><br/>

JavaScript

var clipboard = new ClipboardJS('.copy-link');

function setTooltip(message) {
  $(this).tooltip('hide')
    .attr('data-original-title', message)
    .tooltip('show');
}

function hideTooltip() {
  setTimeout(function() {
    $(this).tooltip('hide');
  }, 1000);
}