How do I copy text to the clipboard in JS?

Question

I would like to put a copy paste on the email, when clicking on the email, the email is copied automatically. I've tried several techniques but I can't.

Here is my code:

    content += '<table class="table"><thead><tr><th>Nom</th><th>Prénom</th><th>Companie</th><th>Tags</th><th class="copy">Email</th></tr></thead><tbody>';

    JSON.parse(data).forEach(id => {
     
      content += '<tr>';
      content += '<td>' + id.lastname + '</td>';
      content += '<td>' + id.firstname + '</td>';
      content += '<td>' + id.company + '</td>';
      content += '<td>' + id.tags + '</td>';
      content += '<td>' + id.email + '</td>';
      content += '</tr>';
    });

    

Answer 1

the main issue come from this line let mail = tabStudents.email; tabstudents is not define and in the process you try to do it's from the iterator of the foreach loop

in my sample i renamed it student

JSON.parse(data).forEach(student => {
let mail = student.email;

here the full sample

 function displayPopup(data) { if (data) { // si data n'est pas vide let content = ''; let modal = document.getElementById("myModal"); let contentModal = document.getElementById("modal-body"); let span = document.getElementsByClassName("close")[0]; content += '<table class="table"><thead><tr><th>Nom</th><th>Prénom</th><th>Companie</th><th>Tags</th><th class="copy">Email</th></tr></thead><tbody>'; JSON.parse(data).forEach(student => { let mail = student.email; console.log(mail) content += '<tr>'; content += '<td>' + student.lastname + '</td>'; content += '<td>' + student.firstname + '</td>'; content += '<td>' + student.company + '</td>'; content += '<td>' + student.tags + '</td>'; content += '<td>' + student.email + '</td>'; content += '</tr>'; }); content += '</tbody></table>'; contentModal.innerHTML = content; modal.style.display = "block" span.onclick = function() { modal.style.display = "none"; } window.onclick = function(event) { if (event.target == modal) { modal.style.display = "none"; } } } } displayPopup('[{"id": 1, "email":"test@test.r"}]');

 <div id="myModal"> <div id="modal-body"> <span class="close"></span> </div> </div>