Simple Copy Button Using JavaScript

I often find myself wanting a simple copy button in my web projects.

This is the recipe I build them from using clipboard.js and a couple lines of JavaScript.

In this case I use icons, specifically LineAwesome, to indicate that the copy operation ocurred. There are certainly better solutions with toasts and the like, which this can easily be extended to.


  class="clippy las la-clipboard"
  data-clipboard-text="I want to be in the clipboard please"
  Click to copy

<script src=""></script>
  var clipboard = new ClipboardJS(".clippy");
  clipboard.on("success", function (e) {
    setTimeout(function () {
    }, 500);

Try it out with this button, which is basically the one from above with some classes to render properly on my blog:

See also