title: PrototypeJS Element.prototype.appendChild issue
body: <p>Due to Ajax loaded content, I had to change a function from:</p>
  
  <pre><code>document.observe('dom:loaded',function() {    
      $$('.userListHeaderCell').invoke('observe', 'click', function() {       
          this.toggleClassName('desc');        
          var colnumber = this.up().childElements().indexOf(this);        
          var content = this.up(2); 
          sortColumn(content, colnumber, this.hasClassName('desc'));    
      });
  });
  </code></pre>
  
  <p>TO:</p>
  
  <pre><code>document.observe('click', function(e, el) {  
      if (el = e.findElement('.userListHeaderCell.sortable')) { 
          el.toggleClassName('desc');        
          var colnumber = el.up().childElements().indexOf(el);        
          var content = el.up(2); 
          sortColumn(content, colnumber, el.hasClassName('desc'));   
      }
  });
  </code></pre>
  
  <p>The sortColumn looks like:</p>
  
  <pre><code>function sortColumn(content, colnumber, desc) {    
      content.select('.userListRow').sort(function(a,b){        
          var atext = a.down(colnumber).innerHTML.stripTags().toLowerCase();        
          var btext = b.down(colnumber).innerHTML.stripTags().toLowerCase();        
          return atext.localeCompare(btext) * (desc ? -1 : 1);    
      }).each(Element.prototype.appendChild, content);
  }
  </code></pre>
  
  <p>The toggle and colnumber work and content is an object HTMLDivElement, but it seems that I need to convert the content variable or use another function, but not sure what in the sortColumn.  The error I get is:</p>
  
  <p>"Could not convert JavaScript argument" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: <a href="https://www.someurl.com/scripts/prototype.js" rel="nofollow">https://www.someurl.com/scripts/prototype.js</a> ::  :: line 804" data: no]</p>
  
  <p>What do I need to change in order to make this work?</p>
  
  <p>Thanks.  </p>
  
  <p>EDIT:</p>
  
  <p>Error in IE shows:
  Unable to get value of the property 'call': object is null or undefined prototype.js, line 804 character 9</p>
  
  <p>I believe the issue is with Element.prototype.appendChild</p>
  
  <p>Tried adding Element.extend(content), but doesn't seem to help.</p>
  
  <p>Example data:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div id="contentbox_Users" class="userList"&gt;
      &lt;div class="userListHeader"&gt;
          &lt;div class="userListHeaderCell col1 sortable"&gt;First Name&lt;/div&gt;
          &lt;div class="userListHeaderCell col2 sortable"&gt;Last Name&lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="contentbox_People"&gt;
          &lt;div class="userListRow"&gt;
              &lt;div class="userListCell col1"&gt;John&lt;/div&gt;
              &lt;div class="userListCell col2"&gt;Smith&lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="userListRow"&gt;
              &lt;div class="userListCell col1"&gt;Bob&lt;/div&gt;
              &lt;div class="userListCell col2"&gt;Ray&lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="userListRow"&gt;
              &lt;div class="userListCell col1"&gt;Fred&lt;/div&gt;
              &lt;div class="userListCell col2"&gt;Jones&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>