title: Label must have associated control
body: <p>There is a div with some elements in it and I want to add a label to it.</p>
  
  <p>This is the original:</p>
  
  <pre><code>&lt;div className="upload-image"&gt;                   
    &lt;input
      name="image"
      id="image-input"
      accept="image/*"
      onChange={this.doSomething}
      multiple
      type="file"
      className="myClass"
    /&gt;
    &lt;span className="upload-image-label"&gt;
      &lt;Icon name="image outline" /&gt;
      drop the image here
    &lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>after the label is added:</p>
  
  <pre><code>&lt;div className="upload-image"&gt;
      &lt;label htmlFor="image-input"&gt;Add image&lt;/label&gt; //this line is added
          &lt;input
             name="image"
             id="image-input"
             accept="image/*"
             onChange={this.doSomething}
             multiple
             type="file"
             className="myClass"
           /&gt;
          &lt;span className="upload-image-label"&gt;
              &lt;Icon name="image outline" /&gt;
               drop the image here
         &lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Initially it was <code>for</code> instead of <code>htmlFor</code> but React said it is an unknown property.</p>
  
  <p>Now, the error says: </p>
  
  <blockquote>
    <p><strong>A form label must be associated with a control</strong></p>
  </blockquote>
  
  <p>Any suggestions?</p>