I'm relatively new to jQuery & Javascript and was wondering if someone could help me condense my code a little.
What I have going on is... multiple div's with different info in them & an ordered list of links. Only one of the divs will display at a time and they can be toggled through by clicking on the corresponding link. HTML: <div id="branding"> <div id="one"> <p>Lorem Ipsum One</p> </div> <div id="two"> <p>Lorem Ipsum Two</p> </div> <div id="three"> <p>Lorem Ipsum Thre</p> </div> <ol> <li><a href="/?brandingId=1">1</a></li> <li><a href="/?brandingId=2">2</a></li> <li><a href="/?brandingId=3">3</a></li> </ol> </div> JQuery: $("#branding ol li:nth-child(1) a").click(function() { $("#branding div").attr('id', 'one'); }); $("#branding ol li:nth-child(2) a").click(function() { $("#branding div").attr('id', 'two'); }); $("#branding ol li:nth-child(3) a").click(function() { $("#branding div").attr('id', 'three'); }); Here is a quick demo page... http://demonstration.dev.matrixgroup.net/brad/toggle/ Thanks for any help, brad