How to toggle accordion between plus and minus sign?

Codepen link.

I have 6 parent accordion links, all with children. To the left, they contain font awesome plus signs.

I want to, on click, toggle the plus sign into a minus sign.

Currently I have my plusSign variable grabbing just the first plus sign to show that it works (using const plusSign = document.querySelector('.fa-plus');).

Works great for the first link. However, I want this to affect all instances.

I tried using querySelectorAll (const plusSign = document.querySelectorAll('.fa-plus');), but it just doesn't work at all.

Code is at the link above but here's the code below just in case:

HTML:

  <!--Quick Link Box-->
  <section class="quick-link-box">
    <div class="columns is-desktop">
      <div class="column">
        <div class="card quick-link-card quick-link-card-mobile" tabindex="0">
          <ul>
            <li>
              <a class="parent accordion" tabindex="0"><i class="fa fa-plus" aria-hidden="true"></i> Control &amp; Automation</a>
              <div class="panel">
                <ul class="child">
                  <li><a href="#">Molded Machine Tool Industrial Control Transformer</a></li>
                  <li><a href="#">Industrial Open Core & Coil Control Transformer</a></li>
                  <li><a href="#">General Purpose Enclosed Transformer</a></li>
                  <li><a href="#">Encapsulated Control Transformer</a></li>
                  <li><a href="#">Energy Efficient Drive Isolation Transformer (Gen. 3)</a></li>
                  <li><a href="#">Energy Efficient Drive Isolation Transformer (Gen. 2)</a></li>
                  <li><a href="#">Drive Isolation Transformer (Gen. 1)</a></li>
                  <li><a href="#">Reactors</a></li>
                  <li><a href="#">DV/DT Filter</a></li>
                  <li><a href="#">Motor Starting Autotransformers</a></li>
                </ul>
              </div>
            </li>
            <li>
              <a class="parent accordion" tabindex="0"><i class="fa fa-plus" aria-hidden="true"></i> Medium Voltage Distribution</a>
              <div class="panel">
                <ul class="child">
                  <li><a href="#">Link #1</a></li>
                  <li><a href="#">Link #2</a></li>
                  <li><a href="#">Link #3</a></li>
                </ul>
              </div>
            </li>
            <li>
              <a class="parent accordion" tabindex="0"><i class="fa fa-plus" aria-hidden="true"></i> Low Voltage Distribution</a>
              <div class="panel">
                <ul class="child">
                  <li><a href="#">Link #1</a></li>
                  <li><a href="#">Link #2</a></li>
                  <li><a href="#">Link #3</a></li>
                </ul>
              </div>
            </li>
            <li>
              <a class="parent accordion" tabindex="0"><i class="fa fa-plus" aria-hidden="true"></i> Encapsulated &amp; Specialty</a>
              <div class="panel">
                <ul class="child">
                  <li><a href="#">Link #1</a></li>
                  <li><a href="#">Link #2</a></li>
                  <li><a href="#">Link #3</a></li>
                </ul>
              </div>
            </li>
            <li>
              <a class="parent accordion" tabindex="0"><i class="fa fa-plus" aria-hidden="true"></i> Custom Products</a>
              <div class="panel">
                <ul class="child">
                  <li><a href="#">Link #1</a></li>
                  <li><a href="#">Link #2</a></li>
                  <li><a href="#">Link #3</a></li>
                </ul>
              </div>
            </li>
            <li>
              <a class="parent accordion" tabindex="0"><i class="fa fa-plus" aria-hidden="true"></i> OEM Products</a>
              <div class="panel">
                <ul class="child">
                  <li><a href="#">Link #1</a></li>
                  <li><a href="#">Link #2</a></li>
                  <li><a href="#">Link #3</a></li>
                </ul>
              </div>
            </li>
          </ul>
        </div>
      </div>
    </div>
  </section>

JS:

const plusSign = document.querySelector('.fa-plus');

let acc = document.getElementsByClassName("accordion");
let i;

for (i = 0; i < acc.length; i++) {
  acc[i].addEventListener("click", function() {

  /* Toggle between hiding and showing the active panel */
  let panel = this.nextElementSibling;
  if (panel.style.display === "block") {
    panel.style.display = "none";
    plusSign.classList.remove('fa-minus');
    plusSign.classList.add('fa-plus');
  } else {
    panel.style.display = "block";
    plusSign.classList.remove('fa-plus');
    plusSign.classList.add('fa-minus');
  }
});
}