title: Javascript tooltip on click
body: <p>I'm trying to add a small popup tooltip to the following code to show that text was successfully copied to the clipboard when the element is clicked. I would like the tooltip to popup saying "Copied" on a click or touch in the case of mobiles for a second, then disappear untill another item is copied.</p>
  
  <p>The code is as follows:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>const tds = document.querySelectorAll("td");
  
  tds.forEach(td =&gt; {
    td.onclick = function() {
      document.execCommand("copy");
    }
  
    td.addEventListener("copy", function(event) {
      event.preventDefault();
      if (event.clipboardData) {
        event.clipboardData.setData("text/plain", td.textContent);
        console.log(event.clipboardData.getData("text"))
      }
    });
  })</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;table&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;Data 1&lt;/td&gt;&lt;td&gt;Data 2&lt;/td&gt;&lt;td&gt;Data 3&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>