Question: I spent a good 20 min searching online for this, but couldn't find it. What I want is to to be able to copy a text string on click *without a button*. The text string will be inside a "span" class.

1. User hovers over text string
2. User clicks text string
3. Text string is copied to clipboard

Any help would be greatly appreciated. Thanks!

Answer: 
You can attach `copy` event to `<span>` element, use `document.execCommand("copy")` within event handler, set `event.clipboardData` to `span` `.textContent` with `.setData()` method of `event.clipboardData` 

```js
const span = document.querySelector("span");

span.onclick = function() {
  document.execCommand("copy");
}

span.addEventListener("copy", function(event) {
  event.preventDefault();
  if (event.clipboardData) {
    event.clipboardData.setData("text/plain", span.textContent);
    console.log(event.clipboardData.getData("text"))
  }
});
```

```html
<span>text</span>
```
Use the Clipboard API!
======================

The simplest modern solution is:

```
navigator.clipboard.writeText(value)

```

That value can later be accessed with:

```
navigator.clipboard.readText()

```

> 
> *NOTE*: To use in an **`iframe`**, you'll need to add write (and maybe read) permissions
> 
> 
> 
> ```
> <iframe src='' allow='clipboard-read; clipboard-write'/>
> 
> ```
> 
> 

> 
> *NOTE*: To use in an browser extension (on a webpage), you'll need either to:
> 
> 
> * call from a user triggered event (`click`...)
> * add the '`clipboardWrite`' permission to the manifest
> 
> 
> 

> 
> *NOTE*: To use in the dev console, use `copy()` instead
> 
> 
> 
> ```
> copy('string')
> 
> ```
> 
> 

[W3Schools Tutorial](https://www.w3schools.com/howto/howto_js_copy_clipboard.asp)

[CanIUse](https://caniuse.com/mdn-api_clipboard_writetext)