title: Materialize CSS cannot open programmatically a collapsible element
body: <p>Trying to execute the <code>open()</code> method of on a specific collapsible element inside DOM calling the following function:</p>
  
  <pre><code>vm.openCollapsible = function( projectName )
  {
  
          // This element is the span that contains the project name
          var element = getElementsByText(projectName);
          // We want to reach out its parent which has collapsible as a class and
          // it's 3 elements upwards.
          //console.log(element[0].parentElement.parentElement.parentElement);
          var collapsible_element = element[0].parentElement.parentElement.parentElement;
          var instance = M.Collapsible.getInstance(collapsible_element);
          console.log(instance);
          instance.open(0);
  }
  </code></pre>
  
  <p>I'm sure that I'm selecting the right element because the <code>console.log(instance)</code> is returning me a valid object.</p>
  
  <pre><code>s {el: ul.collapsible.collapsible-accordion, $el: g(1), options: {…}, $headers: g(1), _handleCollapsibleClickBound: ƒ, …}
  $el: g [ul.collapsible.collapsible-accordion]
  $headers: g [div.collapsible-header.waves-effect.project-toolbar-box]
  el: ul.collapsible.collapsible-accordion
  options: {accordion: true, onOpenStart: undefined, onOpenEnd: undefined, onCloseStart: undefined, onCloseEnd: undefined, …}
  _handleCollapsibleClickBound: ƒ ()
  _handleCollapsibleKeydownBound: ƒ ()
  __proto__: s
  </code></pre>
  
  <p>Any ideas?</p>