"li.menuItem:first" to "li.menuItem:second"?

On page load, the javascript makes the first thumbnail active, but i would like to change it to the second, third or even fourth thumbnail depending on the page that it is loading.

The javascript works for first thumbnail as active:

$('#menu ul li.menuIt开发者_如何学Cem:first').addClass('act').siblings().addClass('inact');
/* On page load, mark the first thumbnail as active */

i've tried changing it to:

$('#menu ul li.menuItem:second').addClass('act').siblings().addClass('inact');

but didnt work..what is the proper code for changing it to second, third, fourth etc..

Use the :eq() selector...

$('#menu ul li.menuItem:eq(2)')

Keep in mind that :eq() is 0 based.

li-menuItem:nth-child(3) will select the 3rd menu item

http://api.jquery.com/nth-child-selector/

You can use the :eq selector

:eq(0) is equivalent to :first
:eq(1) is like doing :second (what you want)

So your code would be:

$('#menu ul li.menuItem:eq(1)')   //This selects the second item

Hope this helps. Cheers