I'm brand new to jquery, and am trying to set up a dynamic navigation dropdown which is populated with XML by our system (which I can't change.) For some reason, IE6 is showing space where the unused <li></li> tags are. I am trying to create a jquery code which will detect whether or not a link is present in the <li> so I can turn the display off or on dynamically. The relevant jquery code is here:

1.         $('li.awardLevels ul li').each(function(){
2.                 if ($('li.awardLevels ul li a').length) {
3.                     console.log('Congrats');
4.                 } else {
5.                     console.log('No Link');
6.                
7.                 }
8.         });

The screenshot of the menu in IE6 is here:


It should eventually appear like this, the way it does in Firefox due to CSS styling:



The test HTML reads:

1. <li class="awardLevels"><a>Award Levels</a>
                   <ul>
                       <li><level_button_0><a href="#">5 Year</a></level_button_0></li>
                       <li><level_button_1><a href="#">10 Year</a></level_button_1></li>
                       <li><level_button_2><a href="#">15 Year</a></level_button_2></li>
                       <li><level_button_3><a href="#">20 Year</a></level_button_3></li>
                       <li><level_button_4><a href="#">25 Year</a></level_button_4></li>
                       <li><level_button_5></level_button_5></li>
                       <li><level_button_6></level_button_6></li>
                       <li><level_button_7></level_button_7></li>
                       <li><level_button_8></level_button_8></li>
                       <li><level_button_9></level_button_9></li>
                       <li><level_button_10></level_button_10></li>
                       <li><level_button_11></level_button_11></li>
                       <li><level_button_12></level_button_12></li>
                       <li><level_button_13></level_button_13></li>
                       <li><level_button_14></level_button_14></li>
                       <li><level_button_15></level_button_15></li>
                       <li><level_button_16></level_button_16></li>
                       <li><level_button_17></level_button_17></li>
                       <li><level_button_18></level_button_18></li>
                       <li><level_button_19></level_button_19></li>
                       <li><level_button_20></level_button_20></li>
                       <li><level_button_21></level_button_21></li>
                   </ul>
               </li>
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   
   

When I run it through Firebug, the console looks like:



Which means that somehow, it is reading the <a> even when there isn't one.

Any ideas?