title: can't get "clipboard.js" to work
body: <p>I can't get the <a href="http://zenorocha.github.io/clipboard.js/" rel="noreferrer">clipboard.js</a> to work; I think it's a simple "misunderstanding" about how the whole thing works, since I'm not even able to get the most simple example to work properly like in <a href="https://jsfiddle.net/xfepfnr0/" rel="noreferrer">this Fiddle</a>...</p>
  
  <p>My specific problem is getting this to work:</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;button class="copyButton" 
          id="copyButtonId" 
          data-id="@item.Type" 
          data-clipboard-action="copy" 
          data-clipboard-target="#copy_@item.Type"&gt;
  &lt;/button&gt;  
  </code></pre>
  
  <p>The div that should be copied is this: </p>
  
  <pre><code>   &lt;div id="copy_@item.Type"&gt;
         @item.Type
         Name...: @item.Name
         Address: @item.Address
     &lt;/div&gt;`
  </code></pre>
  
  <p>The JS is: </p>
  
  <pre><code>$(function() {
  $(document).on("click", ".copyButton", function() {
      var clipboard = new Clipboard(".copyButton"); 
      clipboard.destroy();
    });
  });
  </code></pre>
  
  <p>I'm getting into the function, but nothing is happening. I tried:</p>
  
  <pre><code>clipboard.copy();
  </code></pre>
  
  <p>but that just throws me an exception...</p>
  
  <p>I can get the text, that I want to copy </p>
  
  <p><code>var id= "copy_" + $(this).attr("data-id");
     var source = ($("#" + agent).html());</code></p>
  
  <p>But I should be able only to work it out by using <code>clipboard.js</code>.</p>
  
  <p>I can't get any examples to work, so I would be happy if someone shows me a complete example. I've really tried to understand and I may be overthinking the whole thing and making this more complicated than it is.
  I don't want any workarounds, as I used that before and think this is a great js-solution... If I could just understand it :)</p>
  
  <p>Every hint into the right direction is appreciated!</p>