title: jQuery unable to remove list elements
body: <p>I have a tree with <code>ul</code> and has the following structure:</p>
  
  <pre><code>&lt;div id="Tree"&gt;
    &lt;ul&gt;
      &lt;li&gt;
        &lt;a class="collapseLink" href="#"&gt;
          &lt;span class="hide"&gt;Expand Root Node&lt;/span&gt;
        &lt;/a&gt;
        &lt;a class="selectLink" href="#"&gt;
          Root Node
        &lt;/a&gt;
        &lt;ul&gt;
          &lt;li id="item_1"&gt;Sub Node 1&lt;/li&gt;
          &lt;li id="item_2"&gt;Sub Node 2&lt;/li&gt;
          &lt;li id="item_3"&gt;Sub Node 3&lt;/li&gt;
          &lt;li id="item_4"&gt;Sub Node 4&lt;/li&gt;
          &lt;li id="item_5"&gt;Sub Node 5&lt;/li&gt;
          &lt;li id="item_6"&gt;Sub Node 6&lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>I would ideally like to limit the number of the Sub Nodes in the tree and tried to implement that with the following:</p>
  
  <pre><code>$(document).ready(function() { 
      var rootNode = $('#Tree ul li a:first');
      // If the root node has an 'expandLink' class then it's closed and can be opened    //(via a click)
      if (rootNode.hasClass('expandLink')){
         rootNode.click();
         limitRootNodes();
      }
      function limitRootNodes() {
          // Get the direct child nodes for the root list element
          var tree_ul = $('#Tree ul li ul:first').children();
          // list limit
          var max_listCount = 3;
          // remove the last element if the list size exceeds the limit
          while (tree_ul.size() &gt; max_listCount){
              $('li:last-child', tree_ul).remove();  
          }   
      }
  });
  </code></pre>
  
  <p>However, the above code is not removing the excess list elements. Any suggestions as to what is causing this?</p>