materialize collapsible not expending on click

Question

Materialize collapsible is not expanding on click. I have initialize it proper even then its not working. here is my html code:

.
.

 <p style="color: #fff; font-family: 'Raleway',sans-serif; font-size: 62px; font-weight: 800; line-height: 72px; margin: 0 0 24px; text-align: center; text-transform: uppercase" id="demo"></p>
  <div class="row"></div>
    <ul class="collapsible popout col s6" id="clap">
    <li>
      <div class="collapsible-header"><i class="material-icons">filter_drama</i>First</div>
      <div class="collapsible-body"><span>Lorem ipsum dolor sit amet.</span></div>
    </li>
    </ul>

  <div id="modal1" class="modal">
.
.
.

and this is initialization code

  <script>

  document.addEventListener('DOMContentLoaded', function() {
    checkCurrentUser();
    var elems = document.querySelectorAll('select');
    var instances = M.FormSelect.init(elems);
    var elemss = document.querySelectorAll('.collapsible');
    var instances = M.Collapsible.init(elemss, options);

  });
</script>

In this code I also have select element but its working fine. Only collapsible is not working

Answer 1

Take out the undefined options variable:

var instances = M.Collapsible.init(elemss);

The console should always be the first place to look with any problem, if you look in there you'll see 'options is undefined'.

It's a problem with the documentation.