title: Argument 1 of Node.appendChild is not an object when trying to append basic html
body: <p><strong>General Info</strong><br />
  I'm currently working on a chatsystem using a websocket. Aside from the messages, I'm using the same websocket to present the user with a userlist of those currently online.</p>
  
  <p><strong>The Problem</strong><br />
  Since a couple of days I've been trying to script all of my Javascript purely in OOP approach. So far it's going pretty well but now I've stumpled upon a error I honestly don't understand:</p>
  
  <p><em>Argument 1 of Node.appendChild is not an object</em></p>
  
  <p><strong>The Code</strong><br />
  I've narrowed down my code as far as possible to only represent the important parts:</p>
  
  <pre><code>var CB = CB || {};
  
  CB.messages = {
      userListLayout: function(Username){
          var userListTable = "&lt;table class='userTable' data-user='"+ Username +"'&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;&lt;img src='layout/images/default_profile.png'&gt;&lt;/td&gt;&lt;td&gt;" + Username + "&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;";
  
          return userListTable;
      }
  }
  
  CB.users = {
      set: function(Usernames) {
          var List = document.getElementById('usersList'); // Represents an empty div
          var i, j = Usernames.length, ListUser;
  
          for (i=0; i&lt;j; i++) {
              ListUser = CB.messages.userListLayout(Usernames[i]);
              List.appendChild(ListUser); // Error
          }
      }
  }
  </code></pre>
  
  <p>So the question is: What am I doing wrong and what's the best way to fix it?</p>