title: using jquery ui slider with react
body: <p>I'm trying to integrate jquery ui slider with react:</p>
  
  <pre><code>componentDidMount: -&gt;
    $(React.findDOMNode(@refs.slider)).slider
      value: @props.value
      min: @props.min
      max: @props.max
      step: @props.step
      slide: @handleSlide
  </code></pre>
  
  <p>Displaying the slider and handling the slide callback works fine, however I cannot update the slider from the component:</p>
  
  <pre><code>  slider = $(React.findDOMNode(@refs.slider)).slider
    slider("value", 123)
  </code></pre>
  
  <p>This always fails with "Uncaught TypeError: this.each is not a function" inside jquery ui's "widget.js". Executing <code>$("div.slider").slider("value", 123)</code> in the javascript console and in the component works fine. </p>
  
  <p>But how can I get it working without having to use a css selector and use the react ref?</p>