title: MaterializeCSS Modal Not Opening
body: <p>This is my HTML code for Modal:</p>
  
  <pre><code>&lt;div class="modal"&gt;
    &lt;div class="modal-content"&gt;
      &lt;h4&gt;Modal Header&lt;/h4&gt;
      &lt;p&gt;A bunch of text&lt;/p&gt;
    &lt;/div&gt;
    &lt;div class="modal-footer"&gt;
      &lt;a href="#!" class="modal-close waves-effect waves-green btn-flat"&gt;Agree&lt;/a&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And this is how I am referencing it in JS:</p>
  
  <pre><code>function aFunction() {
      var elem = document.querySelector('.modal');
      var instance = M.Modal.getInstance(elem);
      instance.open();
  }
  </code></pre>
  
  <p>I am calling the function on button click but the modal doesn't show up. The only change I notice is that scrollbars on the right disappear.</p>