<button class="ss-button ss-disp-block ss-left-align" onclick="openAcc('acc')">
  Open Accordion
</button>
<div id="acc" class="ss-container ss-hide">
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur lorem nibh, vehicula in vulputate ac, semper non nulla. Duis eget.
  </p>
</div>
function openAcc(id) {
  var x = document.getElementById(id);
  if (x.className.indexOf("ss-show") == -1) {
    x.className += " ss-show";
  } else { 
    x.className = x.className.replace(" ss-show", "");
  }
}
Run Pen

External CSS

  1. https://cdn.jsdelivr.net/gh/shoaiyb/sysacss@master/sysa.min.css

External JavaScript

This Pen doesn't use any external JavaScript resources.