Question

I’m using jquery, superfish to create a dynamic menu.
But, I’m having trouble adding a bold class to the selected path.
I’m able to select the right submenu and extract the right parents. But when I want to apply the bold css property to the element and the parents. Every item turns bold.
When, I clearly see that some of the child elements don’t have the bold css class.

$n = $("li[id=li_"+$num+"]").parents().filter("li").not('ul menu').addClass('bold');

Answer 1

The children are likely inheriting the bold from their bolded parents. For instance, if you are using nested lists, the “bold” class on a parent li, coupled with a font-weight:bold; style on that class, will make everything in that li bold, including children without the bold class. You will likely need css similar to the following:

li.bold li {
    font-weight:normal;
}
li.bold {
    font-weight:bold !important;
}

Also, “bold” is a bad name for this class – you want to describe the semantics, not the display. I would use something like “selected”, “highlighted” or “active”.

Example.