title: Uncaught TypeError: Cannot read property 'files' of null of element
body: <p>I am creating a little website that has chats on it. Currently, one can only send text messages and I wanted to open a file sender as well for sending image(s), video(s), gif(s).</p>
  
  <p>I have encountered a few problems along the way, but so far got everything without the support of others. However, I am in great need of it now.</p>
  
  <p>By using <code>FormData</code>, Ajax and jQuery, I am able to have real-time images sent from the client to the PHP server. The problem that I am facing is:</p>
  
  <blockquote>
    <p>Uncaught TypeError: Cannot read property 'files' of null</p>
  </blockquote>
  
  <p>when trying to append a file to <code>formData</code>. Take a look:</p>
  
  <pre><code>function opencraze() {
      $(".browse_send_file").change(function () {
          var chat_id = "123";
          var formData = new FormData();
  
          formData.append("chat_id", chat_id);
  
          var name = document.getElementById('#browse_' + chat_id);
          var filemsg = name.files[0];
          formData.append("userfile", filemsg);
      });
  }
  </code></pre>
  
  <p>The HTML:</p>
  
  <pre><code>&lt;div class="chat_wcom" style="width: 25%;"&gt;
      &lt;label for="browse_123" class="material-icons"&gt;&lt;/label&gt;
      &lt;input type="file" class="browse_send_file" id="browse_123" name="browse_send_file" style="display: none"&gt;
      &lt;input maxlength="140" type="text" id="input_123" class="comin" placeholder="My message..." name="sendmsg" onkeypress="g(event,123)" autocapitalize="off" autocorrect="off" style="width: auto;"&gt;
      &lt;input class="hidden_index" type="text" value="123" name="chat_index"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>What happens before everything is that when the user clicks on a <code>div</code>, this HTML above is generated and once it is generated, it calls the <code>opencraze()</code> function. Now, if one presses on the label of the chat, one selects the file and it activates the <code>.change()</code> jQuery function. The error is on the line of:</p>
  
  <pre><code>var filemsg = name.files[0];
  </code></pre>
  
  <p>Any help would be appreciated.
  Thank you for your time.</p>