I have a web page with different links.
I want these links to show different divs that are hidden from the beginning. Link #1 should show Div #1 and so on. If Div #1 is open and I press Link #3, Div #1 should be hidden and Div #3 should appear instead.
How do I approach this problem in the best way?
Thanks!
<a id="Link1" class="links" href="#" data-showdiv="Div1">Link 1</a>
<a id="Link2" class="links" href="#" data-showdiv="Div2">Link 2</a>
<a id="Link3" class="links" href="#" data-showdiv="Div3">Link 3</a>
etc...
<div id="Div1" class="divs"></div>
<div id="Div2" class="divs"></div>
<div id="Div3" class="divs"></div>
etc...
$(".links").click(function(){
$("divs:visible").hide();
$("#"+$(this).attr("data-showdiv")).show();
});