title: Clear and reset form input fields
body: <p>I have a form containing various input fields and two buttons; one for submitting and one for cancelling.</p>
  
  <pre><code>&lt;form id="create-course-form"&gt;
    &lt;input type="text" name="course_Name" ref="fieldName"&gt;
    &lt;input type="text" name="course_org" ref="fieldOrg"&gt;
    &lt;input type="text" name="course_Number" ref="fieldNum"&gt;
  
    &lt;input type="submit" name="saveCourse" value="Create"&gt;
    &lt;input type="button" name="cancelCourse" value="cancel" onClick={this.cancelCourse}&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>What I want is to empty all inputs when the cancel button is clicked. So far I've managed to do this by using each input's <strong>ref</strong> prop.</p>
  
  <pre><code>cancelCourse(){
    this.refs.fieldName.value="";
    this.refs.fieldorg.value="";
    this.refs.fieldNum.value="";
  }
  </code></pre>
  
  <p>However, I want to empty the input fields without having to empty each one seperately. I want something similar to this (jQuery): <code>$('#create-course-form input[type=text]').val('');</code></p>