Hi, I am using JQuery to show and hide sections of text within my page. The page has 10 sections of thext and 10 links.
I want to initially hide all 10 sections of text, and then show section 3 when the link for section 3 is clicked, but make sure any previously shown sections are then hidden. Here is what I have used so far which dies wxactly what I want but seems very long winded. $(document).ready(function hideAll() { //$('.stepText').hide(); $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); $('.step1').click(function(){ $('.step1').removeClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step2').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').removeClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step3').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').removeClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step4').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').removeClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step5').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').removeClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step6').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').removeClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step7').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').removeClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step8').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').removeClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step9').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').removeClass('hiddenstep'); $('.step10').addClass('hiddenstep'); }); $('.step10').click(function(){ $('.step1').addClass('hiddenstep'); $('.step2').addClass('hiddenstep'); $('.step3').addClass('hiddenstep'); $('.step4').addClass('hiddenstep'); $('.step5').addClass('hiddenstep'); $('.step6').addClass('hiddenstep'); $('.step7').addClass('hiddenstep'); $('.step8').addClass('hiddenstep'); $('.step9').addClass('hiddenstep'); $('.step10').removeClass('hiddenstep'); }); });