Send E-mail to multiple co-workers using JS-CodePudding

I feel like I'm close but need a little help with finishing this task. I have a table set up with some information and E-mail addresses. I have added a button, that when pressed will open up my E-mail client and populate the To: block with everyone's E-mail address separated by a semicolon. Problem is, when I press the button, My E-mail client opens up and only includes the first E-mail address in the To: line. Here is what I have so far:

<tr style=text-align:center>
    <td>Electrical</td>
    <td>Mr. Jones</td>
    <td ><a href="mailto:[email protected]">[email protected]</a></td>
    <td>Ms. Jackson</td>
    <td ><a href="mailto:[email protected]">[email protected]</a></td>
    <td>Mr. Parker</td>
    <td ><a href="mailto:[email protected]">[email protected]</a></td>

<button onclick="send()"style=background-color:red>Send E-mail to all Personnel</button>
    <script>
            function send() {
            let x = document.querySelectorAll("td.email");
            var i;
            for (i = 0; i < x.length; i  ) {   
            window.location.href = "mailto:"   x[i].innerText;}}
    </script>

I have tried assigning a variable for the output of the 'for' loop, and including that variable in the window.location.href line, but nothing seems to work.

CodePudding user response：

In the first iteration of the loop, the window's location is changed, so javascript on the page stops executing. The rest of the loop iterations will not run. Each iteration is written to change to location to change the location separately.

You want to create a single email where the to field is to multiple addresses. I personally think this SO thread is sufficient for you to work out what to do, but I'll try to spell it out:

function send() {
  let x = Array.from(document.querySelectorAll("td.email"));
  window.location.href = "mailto:"   x.map(e => e.textContent).join(";")
}