Variable usage

I have tried to adapt some code written by Timothy van Sas and it’s so I can display different featured portfolio pieces on my site:

www.nicktoye.co.uk

Now this is the code I have got at the moment.

$(document).ready(function(){
	var imgWrapper = $('#project-piece li');
	var imgNav = $('ul#project-nav li a');
	imgNav.filter(':first').addClass('current');
	// only show the first image, hide the rest
	imgWrapper.hide().filter(':first').show();
			
	$('ul#project-nav li a').click(function () {
			
	// check if this item doesn't have class "current"
	// if it has class "current" it must not execute the script again
	if (this.className.indexOf('current') == -1){
		imgWrapper.hide();
		imgWrapper.filter(this.hash).fadeIn(300);
		$('ul#project-nav li a').removeClass('current');
		$(this).addClass('current');
		}
		return false;
	});
});

Now I wanted to use the var imgNav like this:

$('imgNav').click(function () {

But it doesn’t work. Is there any reason why it wouldn’t?

$(‘imgNav’) tells jquery to find <imgNav> elements in the document. Obviously they don’t exist.

You probably meant to use
imgNav.click(
because imgNav is a jquery object.

ah, it’s looking for a string. Schoolboy error.

Any advice on how I could fade out the old li element and fade in the new?