How do I filter <li> under a<ul> having a particular id?

Question

        <ul class="apple" id="A">
             <li>
             <li>
              .....
              ......
              ......

        </ul>

         <ul class="apple" id="B">
             <li>
             <li>
              .....
              ......
              ......

        </ul>

In the above code I get the ul having id B using jQuery selector.

$(selector).find('ul.apple #B') This does not seem to work.

I want to display all the li under the ul having class=apple & id ="B" . The above code is in FTL ( freemarker) & I am trying to trigger the id written in freemarker from the js code.

Thanks :)

Answer 1

Id's should be unique in a document. You never need to include any other selector but the id itself $('#B'). No need for .find or anything - there's only one on the page anyway.

If you want a reference to the li tags under #B, here are two ways:

//get a reference to the list
var $B = $('#B');
//get children (which are lis)
var $lis = $B.children();

or just get the lis directly:

var $lis = $('#B li');

Answer 2

Normall you only need to specify the id, as it's unique in the page, so a selector like this would work:

#B li

If you still need to specify the element and class, for example if you are using the same CSS for several pages, you would specify them without spaces between:

ul.apple#b li

Answer 3

In the HTML 4.01 specification, it is specified that element IDs must be unique.

That said, you can just query by the id via:

$('#A');

Answer 4

select UI by id and class name: $('B .apple')