Accordion

      <coral-accordion>
        <coral-accordion-item selected="">
          <coral-accordion-item-label>First with <a class="coral-Link" coral-interactive="">link</a></coral-accordion-item-label>
          This is the first bit o'content
        </coral-accordion-item>
        <coral-accordion-item>
          <coral-accordion-item-label>Second</coral-accordion-item-label>
          This is the second bit o'content
        </coral-accordion-item>
        <coral-accordion-item>
          <coral-accordion-item-label>Third</coral-accordion-item-label>
          This is the third bit o'content
        </coral-accordion-item>
      </coral-accordion>
    

      <coral-accordion multiple="">
        <coral-accordion-item selected="">
          <coral-accordion-item-label>First <span class="u-coral-screenReaderOnly">(Multiple)</span></coral-accordion-item-label>
          Chocolate cake jelly cupcake dessert. Chocolate bar lemon drops croissant
          candy canes caramels jelly beans lemon drops pie wypas. Faworki donut macaroon
          jujubes brownie cupcake topping macaroon gummies. Halvah gummi bears brownie
          chupa chups. Fruitcake lemon drops gingerbread cake apple pie. Pastry carrot
          cake pie. Brownie oat cake gummies. Bonbon soufflé jujubes soufflé biscuit.
          <a class="coral-Link" href="#">Chocolate cake</a>
          halvah chocolate cake candy canes powder chocolate croissant. Lollipop fruitcake
          muffin chocolate cake apple pie bear claw cookie tootsie roll. Chupa chups dessert
          icing gummies cake jelly pie sesame snaps. Wafer halvah cake sweet.
        </coral-accordion-item>
        <coral-accordion-item selected="">
          <coral-accordion-item-label>Second <span class="u-coral-screenReaderOnly">(Multiple)</span></coral-accordion-item-label>
          Chocolate cake jelly cupcake dessert. Chocolate bar lemon drops croissant candy
          canes caramels jelly beans lemon drops pie wypas. Faworki donut macaroon jujubes
          brownie cupcake topping macaroon gummies. Halvah gummi bears brownie chupa chups.
          Fruitcake lemon drops gingerbread cake apple pie. Pastry carrot cake pie.
          Brownie oat cake gummies. Bonbon soufflé jujubes soufflé biscuit.
          <a class="coral-Link" href="#">Chocolate cake</a>
          halvah chocolate cake candy canes powder chocolate croissant. Lollipop fruitcake
          muffin chocolate cake apple pie bear claw cookie tootsie roll. Chupa chups dessert
          icing gummies cake jelly pie sesame snaps. Wafer halvah cake sweet.
        </coral-accordion-item>
      </coral-accordion>
    

      <coral-accordion>
        <coral-accordion-item disabled="">
          <coral-accordion-item-label>First <span class="u-coral-screenReaderOnly">(Disabled)</span></coral-accordion-item-label>
          Chocolate cake jelly cupcake dessert. Chocolate bar lemon drops croissant candy
          canes caramels jelly beans lemon drops pie wypas. Faworki donut macaroon jujubes
          brownie cupcake topping macaroon gummies. Halvah gummi bears brownie chupa chups.
          Fruitcake lemon drops gingerbread cake apple pie. Pastry carrot cake pie. Brownie
          oat cake gummies. Bonbon soufflé jujubes soufflé biscuit.
          <a class="coral-Link" href="#">Chocolate cake</a>
          halvah chocolate cake candy canes powder chocolate croissant. Lollipop fruitcake
          muffin chocolate cake apple pie bear claw cookie tootsie roll. Chupa chups dessert
          icing gummies cake jelly pie sesame snaps. Wafer halvah cake sweet.
        </coral-accordion-item>
        <coral-accordion-item disabled="" selected="">
          <coral-accordion-item-label>Second <span class="u-coral-screenReaderOnly">(Disabled)</span></coral-accordion-item-label>
          Chocolate cake jelly cupcake dessert. Chocolate bar lemon drops croissant candy canes
          caramels jelly beans lemon drops pie wypas. Faworki donut macaroon jujubes brownie
          cupcake topping macaroon gummies. Halvah gummi bears brownie chupa chups.
          Fruitcake lemon drops gingerbread cake apple pie. Pastry carrot cake pie.
          Brownie oat cake gummies. Bonbon soufflé jujubes soufflé biscuit.
          <a class="coral-Link" href="#">Chocolate cake</a>
          halvah chocolate cake candy canes powder chocolate croissant. Lollipop fruitcake
          muffin chocolate cake apple pie bear claw cookie tootsie roll. Chupa chups dessert
          icing gummies cake jelly pie sesame snaps. Wafer halvah cake sweet.
        </coral-accordion-item>
      </coral-accordion>
    

      <coral-accordion multiple="">
        <coral-accordion-item selected="">
          <coral-accordion-item-label>First <span class="u-coral-screenReaderOnly">(Nested)</span></coral-accordion-item-label>
          <coral-accordion-item-content>This is the first bit o'content</coral-accordion-item-content>
        </coral-accordion-item>
        <coral-accordion-item selected="">
          <coral-accordion-item-label>Second <span class="u-coral-screenReaderOnly">(Nested)</span></coral-accordion-item-label>
          <coral-accordion-item-content>This is the second bit o'content</coral-accordion-item-content>
        </coral-accordion-item>
        <coral-accordion-item selected="">
          <coral-accordion-item-label>Third <span class="u-coral-screenReaderOnly">(Nested)</span></coral-accordion-item-label>
          <coral-accordion-item-content>
            <coral-accordion level="4">
              <coral-accordion-item>
                <coral-accordion-item-label>First <span class="u-coral-screenReaderOnly">(Nested - Level 2)</span></coral-accordion-item-label>
                <span tabindex="0">This is the first bit o'content</span>
              </coral-accordion-item>
              <coral-accordion-item selected="">
                <coral-accordion-item-label>Second <span class="u-coral-screenReaderOnly">(Nested - Level 2)</span></coral-accordion-item-label>
                <span tabindex="0">This is the second bit o'content</span>
              </coral-accordion-item>
              <coral-accordion-item>
                <coral-accordion-item-label>Third <span class="u-coral-screenReaderOnly">(Nested - Level 2)</span></coral-accordion-item-label>
                <span tabindex="0">This is the third bit o'content</span>
              </coral-accordion-item>
            </coral-accordion>
          </coral-accordion-item-content>
        </coral-accordion-item>
      </coral-accordion>
    

      <div id="from-javascript"></div>
      <script>
        window.addEventListener('load', function() {
          var accordion = new Coral.Accordion();
          accordion.setAttribute('aria-labelledby', document.getElementById('from-javascript').parentElement.previousElementSibling.id);
          accordion.items.add({
            label: {
              innerHTML: 'First <span class="u-coral-screenReaderOnly">(From JavaScript)</span>'
            },
            content: {
              innerHTML: 'This is the first bit o\'content'
            }
          });

          accordion.items.add({
            label: {
              innerHTML: 'Second <span class="u-coral-screenReaderOnly">(From JavaScript)</span>'
            },
            content: {
              innerHTML: 'This is the second bit o\'content',
            }
          });

          accordion.items.add({
            label: {
              innerHTML: 'Third <span class="u-coral-screenReaderOnly">(From JavaScript)</span>'
            },
            content: {
              innerHTML: 'This is the third bit o\'content, with no subtitle'
            }
          });

          document.getElementById('from-javascript').appendChild(accordion);
        });
      </script>