Including variable in jquery selector

Question

Hi there,

I have a quick question. I'm matching class names of LI elements to turn on and off divs with a matching ID name, as follows:

$("ul#mainnav li").click(function() {
      $("#mainpages > div").fadeOut(200);
          var navClass = $(this).attr('class');
          var targeted='#'+navClass;
    $(targeted).fadeIn(200); // this is working
        $(targeted+'div:first').show(); // this is not working
});

I'm wondering how to include the variable "targeted" into the selector $(targeted 'div:first').show(); This is basically how I want to reset my subpages to show the first div on click of a main navigation item, so I want to show() the first child div of the targeted container. I've searched but can't seem to get it working.

Thanks for any suggestions!

Answer 1

You need a space before the "div" in "div:first":

$(targeted+' div:first').show();

Alternatively:

$(targeted).find('div:first').show();

Answer 2

You missed a space:

$(targeted+' div:first').show();