title: Trying to sort a list in my html with javascript
body: <p>im having a bit of trouble with the code below:</p>
  
  <p><strong>Html:</strong></p>
  
  <pre><code>&lt;p&gt;click to &lt;a onclick ="sortList(); return false;" href="#"&gt;sort&lt;/a&gt;&lt;/p&gt;
  &lt;ul id="fruits"&gt;
    &lt;li&gt;apple&lt;/li&gt;
    &lt;li&gt;orange&lt;/li&gt;
    &lt;li&gt;banana&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p><strong>Javascript:</strong></p>
  
  <pre><code>function sortList(listId) {
      var list = document.getElementbyId(listId);
      var children = list.childNodes;
  
      var listItemsHTML = new Array();
      for (var i = 0; i &lt; children.length; i++) {
          if (children[i].nodeName === "LI") {
              listItemsHTML.push(children[i].innerHTML);
          }
      }
      listItemsHTML.sort();
      list.innerHTML="";
      for (var i = 0; i &lt; listItemsHTML.length; i++) {
          list.innerHTML += "&lt;li&gt;" + listItemsHTML[i] + "&lt;/li&gt;";
      }
  }
  </code></pre>
  
  <p>however, when i try and click the link to sort the html does nothing and im not sure what the problem is. i am referencing and was able to use changeit and echo function to produce an alert message in the .js file just cant sort</p>