I've done a lot of search on this subject but haven't been able to find any examples of using variables in [attribute=xx] selectors, only literals. As far as I can see it doesn't work and I was wondering if there is any way to make it work -- for example with special syntax used in this position. Here is an example of what I am trying to do:
var doPagenav = function() { $('a.pagenav').click(function() { var dummy = $(this).attr('custom'); $('#contentpane').load(dummy); $("#tree li a").css('background-color', ''); $("#tree li a[custom=dummy]").css('background-color', 'yellow'); }) } The page contains a table of contents (TOC) with links that load external HTML pages into a div called #contentpane. In the pages themselves there are also navigation links for other pages (e.g. Next/ Previous) that load other pages. When the user clicks these links I want to synchronize the highlight in the TOC so that the currently displayed page title is highlighted, just as it would be when you select it directly. In the test code the page links are in a non- standard attribute called "custom", I'm going to deal with parsing the href attributes later on in the development process. The "dummy" variable defined in line 3 works in the next line for loading the page into the #contentpane div. However, it doesn't work in the [custom=dummy] attribute selector in the final line -- my guess is this is prevented by the fact that this selector accepts literals both with and without quotes. It works fine if I insert the page name as a literal (e.g. 'introduction.htm') and I've repeatedly tested with alerts that the "dummy" variable does contain the correct string at this point. I'm feeling a bit stumped. Is there any way around this problem, or an alternative approach? Cheers, Tim