title: Javascript Query All Selectors and do something
body: <p>Goal:
  Apply action to each checked element if checked, vs just the one element.</p>
  <p>I am setting up multiple buttons (custom components) that when clicked, the border changes for the <p> tag within . When clicked again, the border resets.</p>
  <p>I have 'checked' properly displaying when I click on the flash-card-check-mark (elm), however my code is only selecting the first item and ignoring the rest.</p>
  <p>Can you point me in the right direction as to how I would go about making sure that -- any -- of the buttons being clicked will have this action applied?</p>
  <p>(new to javascript and appreciate your insight)</p>
  <p>Note: This is for code example (doesn't run without the component checked but shows the markup I'm using -- I would share a link but this is running locally)</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>document.querySelector('flash-card-check-mark').onclick = function() {
  
    var elem = document.querySelector('flash-card-check-mark');
    var elemContent = document.querySelector('flash-card-check-mark p');
  
  
    if (elem.getAttribute("checked") === null) {
      elemContent.style.border = "1px solid #0000";
    } else {
      elemContent.style.border = "1px solid magenta";
    }
  
  };</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;flash-card-check-mark no-default-padding="true"&gt;
    &lt;p align="left" size="small" class="pa-2"&gt;
      &lt;span slot="heading"&gt;Start my marketing today&lt;/span&gt;
    &lt;/p&gt;
  &lt;/flash-card-check-mark&gt;
  &lt;flash-card-check-mark no-default-padding="true"&gt;
    &lt;p align="left" size="small" class="pa-2"&gt;
      &lt;span slot="heading"&gt;Create automated customer journeys&lt;/span&gt;
    &lt;/p&gt;
  &lt;/flash-card-check-mark&gt;</code></pre>
  </div>
  </div>
  </p>