title: Trying to copy text from two different text areas on button click
body: <p>I'm new to JS so I apologize in advance if this is an easy answer.</p>
  <p>I'm trying to select and copy text from two different text area boxes when a button is pressed. I can only figure out how to get one text area to be copied at a time using getElementbyID. I've tried using querySelectorAll(&quot;&quot;).select(); with no luck. What am I missing?</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang=&quot;en&quot;&gt;
  
  &lt;head&gt;
    &lt;meta charset=&quot;UTF-8&quot;&gt;
    &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;
    &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1.0&quot;&gt;
    &lt;title&gt;Test&lt;/title&gt;
  &lt;/head&gt;
  
  &lt;body class=&quot;bg-gray-100&quot;&gt;
  
    &lt;div class=&quot;container font-sans bg-white mx-auto px-4 py-4 rounded shadow-md&quot;&gt;
  
      &lt;form action=&quot;&quot; method=&quot;&quot; class=&quot;form grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4&quot;&gt;
        &lt;div class=&quot;text-lg w-full underline font-bold col-span-1 sm:col-span-2 md:col-span-3 lg:col-span-4&quot;&gt;
          &lt;h1&gt;Notification Information&lt;/h1&gt;
        &lt;/div&gt;
  
   &lt;div class=&quot;inline-flex w-full text-lg underline font-bold mt-4 col-span-1 sm:col-span-2 md:col-span-3 lg:col-span-4&quot;&gt;
          &lt;h1 class=&quot;mx-2&quot;&gt;Media Script&lt;/h1&gt;
          &lt;div&gt;&lt;button type=&quot;button&quot; id=&quot;plusScript&quot; onclick=&quot;addText()&quot; class=&quot;text-sm border border-transpartent border-2 border-blue-300 bg-trasparent px-1 p-1 rounded shadow text-blue-400 mx-2 font-bold&quot;&gt;New Script&lt;/button&gt;&lt;/div&gt;
          &lt;div&gt;&lt;button type=&quot;button&quot; onclick=&quot;copyAll()&quot; class=&quot;text-sm border border-transpartent border-2 border-blue-300 bg-trasparent px-1 p-1 rounded shadow text-blue-400 mx-2 font-bold&quot;&gt;Copy Script&lt;/button&gt;&lt;/div&gt;
        &lt;/div&gt;
  
        &lt;div class=&quot;Media Script Header space-y-4&quot;&gt;
          &lt;label for=&quot;Media Script Header&quot;&gt;&lt;/label&gt;
          &lt;textarea name=&quot;Media Script&quot; rows=&quot;1&quot; cols=&quot;70&quot; id=&quot;script&quot; placeholder=&quot;Media Script Header&quot; class=&quot;copyScript resize-none text-sm col-span-1 sm:col-span-2 md:col-span-3 focus:outline-none focus:ring-2 focus:ring-blue-300 focus:border-transparent rounded shadow-sm focus:ring-opacity-75 mx-2&quot;&gt;
  &lt;/textarea&gt;
  
          &lt;label for=&quot;Media Script&quot;&gt;&lt;/label&gt;
          &lt;textarea name=&quot;Media Script&quot; rows=&quot;5&quot; cols=&quot;70&quot; id=&quot;scriptNarrative&quot; placeholder=&quot;Media Script Narrative&quot; class=&quot;copyScript no-wrap resize-none text-sm col-span-1 sm:col-span-2 md:col-span-3 focus:outline-none focus:ring-2 focus:ring-blue-300 focus:border-transparent rounded shadow-sm focus:ring-opacity-75 mx-2&quot;&gt;
  &lt;/textarea&gt;
        &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  
      function copyAll() {
    document.querySelectorAll(&quot;copyScript&quot;).select()
    document.execCommand(&quot;copy&quot;);
  }
  
   
  </code></pre>