JQuery on List

Question

Dear all I am using the jQuery. Now I need to classify the two lists

     If any list having Id starts with outer i need to alert it Outer.
     If any list having Id starts with sub  i need to alert it Sub.

<ul id="nav">
     <li id="outer1"><a href="#url"><b class="">Outer 1</b></a></li> 
     <li id="outer2"><a href="#url"><b class="">Outer 2</b></a></li>

     <li id="outer3"><a href="#url"><b class="">Outer 3  </b></a>
          <ul style="display: none;">
             <li id="sub1"><a href="#url"><span id="inner1"> inner1</span></a></li>
             <li id="sub2"><a href="#url"><span id="inner2"> inner2</span></a></li> 

         </ul>
     </li>
     <li id="outer4"><a href="#url"><b class="">Outer 3  </b></a></li>
</ul>

My Code. I done the following code

$("li").each(function(){ 
      $( "li[ @id ^= 'start' ]" )
           alert("START");
        $( "li[ @id ^= 'sub' ]" )
           alert("SUB");
 });

     What change should i made in order to execute correctly

Answer 1

$("li").each(function(){ $( "li[ @id ^= 'start' ]" )

In the each loop, you have to make use of this keyword. So, each LI is this. For what are you trying to do, if i was you, i'l do it like this:

$("li").each(function(){ 
 $(this).is('[id^=start]')
})

however, i guess you better re-think your rationament. Because i don't think you will need all that ID's. For selecting first level of LI you can use this:

$('ul > li')

then, for the next level you can use

$('ul > ul > li')

And so on

Answer 2

If you just want to distinguish between the first and second level list items, you can also simply use $("li li") for the second level and something like $("li:not(li li)") for the first level (not tested).

Answer 3

$("li").each(function()
{ 
    if($(this).is("[id^='start']")) alert("START");
    else if($(this).is("[id^='sub']")) alert("SUB");
});