title: Materialize 'Select' component not working in React
body: <p>As stated in the question, I'm trying to use the Select component in <strong>MaterializeCSS/React</strong> and the webpage rendering looks like this:<a href="https://i.stack.imgur.com/XLInm.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/XLInm.png" alt="failing materialize select"></a></p>
  
  <p>The text is greyed out and I can't click or interact with it. This is my relevant code:</p>
  
  <p>I have included:</p>
  
  <pre><code>import ReactDOM from 'react-dom';
  import $ from 'jquery'; 
  </code></pre>
  
  <p>My <em>componentDidMount()</em> method looks like this:</p>
  
  <pre><code>componentDidMount() {
    var element = ReactDOM.findDOMNode(this.refs.dropdown)
    $(element).ready(function() {
      $('select').material_select();
    });
  }
  </code></pre>
  
  <p>And in my <em>render()</em> function I have the sample code from the <a href="http://materializecss.com/forms.html" rel="nofollow noreferrer">Materialize Website</a>:</p>
  
  <pre><code>&lt;div class="input-field offset-s3 col s1"&gt;
    &lt;select&gt;
      &lt;option value="" disabled selected&gt;Choose your option&lt;/option&gt;
      &lt;option value="1"&gt;Option 1&lt;/option&gt;
      &lt;option value="2"&gt;Option 2&lt;/option&gt;
      &lt;option value="3"&gt;Option 3&lt;/option&gt;
    &lt;/select&gt;
    &lt;label&gt;Materialize Select&lt;/label&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What am I doing wrong here? I followed the advice given here but it doesn't seem to be working:</p>
  
  <p><a href="https://stackoverflow.com/questions/36339354/how-do-i-get-the-materialize-select-dropdown-to-work-with-react">How do I get the Materialize select dropdown to work with React?</a></p>
  
  <p>I've scoured around but can't seem to find other threads with people describing the same behavior.</p>