Accordions

by Alex McWhinnie

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://assets.ipums.org/_css/jsfiddle.1.0.css">
<script src="https://assets.ipums.org/_js/load-fonts.1.3.js"></script>
<script src="https://assets.ipums.org/_js/page-tune-fiddle.1.5.js"></script>
<div class="accordion">
  <h2 class="accordion-header">Header 1</h2>
  <div class="accordion-content">
    Content 1 goes here. It can be anything. A list, a table, multiple paragraphs, etc. 
  </div>
  <h2 class="accordion-header">Header 2</h2>
  <div class="accordion-content">
    Content 2 goes here. It can be anything. A list, a table, multiple paragraphs, etc. 
  </div>
  <h2 class="accordion-header">Header 3</h2>
  <div class="accordion-content">
    Content 3 goes here. It can be anything. A list, a table, multiple paragraphs, etc. 
  </div>
</div>