how to Copy to clipboard by JavaScript

<textarea id="textarea">Copy to clipboard</textarea>
<input type="button" value="copy to clipboard" onclick="CopyToClipBoard()">
<script type="text/javascript">
function CopyToClipBoard(){
var text=$('#textarea').val();
//copytoclipboard(text);
}
</script>

    <script src="ZeroClipboard.js"></script>

   <button id="copy-button" data-clipboard-text="Copy Me!" title="Click to copy me.">Copy to Clipboard</button>
<script type="text/javascript">
var client = new ZeroClipboard( document.getElementById("copy-button") );

client.on( "ready", function( readyEvent ) {
  // alert( "ZeroClipboard SWF is ready!" );

  client.on( "aftercopy", function( event ) {
    // `this` === `client`
    // `event.target` === the element that was clicked
    event.target.style.display = "none";
    alert("Copied text to clipboard: " + event.data["text/plain"] );
  } );
} );
</script>

<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.16/clipboard.min.js"></script>
<textarea id="textarea">Copy to clipboard</textarea>
<button class="btn" data-clipboard-action="copy" data-clipboard-target="#textarea" >Copy
 </button>

<textarea id="copyme">Copy to clipboard in pure JavaScript No library or plugin OverHead </textarea>
<input type="button" value="copy to clipboard" onclick="CopyToClipBoard()">

 function copyhandler(){
         document.execCommand('copy');
 }
 document.addEventListener('copy', function(e){
 
    e.clipboardData.setData('text/plain',document.getElementById('copyme').value);
      e.preventDefault(); // We want our data, not data from any selection, to be written to the clipboard
});

document.getElementById('textarea').addEventListener('copy', function(event){
 
   event.clipboardData.setData('text/plain',document.getElementById('textarea').value);
      event.preventDefault(); // We want our data, not data from any selection, to be written to the clipboard
});