title: How to dynamically add class to parent div of focused input field?
body: <p>Below is my form.jsx file</p>
  
  <pre><code>var React = require('react');
  var Input = require('./input');
  
  module.exports = React.createClass({
      getInitialState: function() {
          return {
              focus: false
          }
      },
      render: function () {
          return &lt;div className="info_input"&gt;
              &lt;div className="demo demo2 lll"&gt;
                    &lt;div className={"css " + (this.state.focus ? "active" : "")}&gt;
                      &lt;label htmlFor="d3"&gt;{this.props.firstCol}&lt;/label&gt;
                      &lt;Input id="d3" type="text" handleFocus={this.addClass} handleBlur={this.removeClass} /&gt;
                    &lt;/div&gt;
              &lt;/div&gt;
                  &lt;div className="demo demo2"&gt;
                    &lt;div className={"css " + (this.state.focus ? "active" : "")}&gt;
                      &lt;label htmlFor="d3"&gt;{this.props.secondCol}&lt;/label&gt;
                      &lt;Input id="d3" type="text" /&gt;
                    &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div className="clear"&gt;&lt;/div&gt;
          &lt;/div&gt;
      },
      addClass: function () {
              this.setState({
              focus: true
          });
      },
      removeClass: function () {
          this.setState({
              focus: false
          });
      }
  });
  </code></pre>
  
  <p>and this is my Input component .jsx file</p>
  
  <pre><code>var React = require('react');
  
  module.exports = React.createClass({
      getInitialState: function () {
          return {
              focus: false
          }
      },
      render: function() {
          return &lt;input id={this.props.id} 
                        type={this.props.type} 
                        onFocus={this.props.handleFocus} 
                        onBlur={this.props.handleBlur} 
                        autofocus={this.state.focus} /&gt;
      }
  }); 
  </code></pre>
  
  <p>If I focus on input field, it will add "active" className to its parent div.
  However, all input field will also be added "active" class.</p>
  
  <p>How can I do to only add class to parent div of focused input not all of them.</p>