Shopify Accordion

product.html

<ul class="product-swatches">
<li class="active-swatch">
  <a href="#">
    <div class="purple single-swatch"></div>
  </a>
</li>
<li>
  <a href="#">
    <div class="green single-swatch"></div>
  </a>
</li>
<li>
  <a href="#">
    <div class="blue single-swatch"></div>
  </a>
</li>
</ul>
<ul class="accordion">
  <li class="accordion-item">
    <h5 class="accordion-thumb">How To Use</h5>
    <p class="accordion-panel">Lorem ipsum dolor sit amet, consectetur adipisicingelit. Reprehenderit quos, accusamus! Enim laboretotam dicta quibusdam? Eveniet quis asperioresreprehenderit eaque atque in iure voluptate, explicabo, placeat, id earum architecto!</p>
  </li>
  <li class="accordion-item">
    <h5 class="accordion-thumb">Materials</h5>
    <p class="accordion-panel">Lorem ipsum dolor sit amet, consectetur adipisicingelit. Reprehenderit quos, accusamus! Enim laboretotam dicta quibusdam? Eveniet quis asperioresreprehenderit eaque atque in iure voluptate, explicabo, placeat, id earum architecto!</p>
  </li>
  <li class="accordion-item">
    <h5 class="accordion-thumb">Features</h5>
    <p class="accordion-panel">Lorem ipsum dolor sit amet, consectetur adipisicingelit. Reprehenderit quos, accusamus! Enim laboretotam dicta quibusdam? Eveniet quis asperioresreprehenderit eaque atque in iure voluptate, explicabo, placeat, id earum architecto!</p>
  </li>
</ul>