title: When File Selected Change Label Contents jQuery
body: <p>So, I'm attempting to make my file upload input look a little bit better than the default buttons. All is going well, however, I can't seem to find a jQuery script which can do what I want it to do. </p>
  
  <p>What I want to happen is, when a file isn't selected, I would like the label to display "Choose an avatar", but when a file is selected, I would like it to display the files name, i.e: "example.png" instead of "Choose an avatar". </p>
  
  <p>This is my HTML:</p>
  
  <pre><code>&lt;form action="" method="post" class="avatar-form-form" enctype="multipart/form-data"&gt;
      &lt;input id="avatar-file" type="file" name="avatar"&gt;
      &lt;label for="avatar-file"&gt;Choose An Avatar&lt;/label&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Also, if the user selects multiple files, I would like it to say "Too many files selected."</p>
  
  <p>All help is appreciated as I am new to jQuery.</p>