使用jquery隐藏/显示div时，链接停止工作

Question

I've succeeded in getting divs to show/hide but now for some reason, all other links on the page stop working unless if I open them in a new tab. How can I get this fixed?

 $(document).ready(function () { $("#div9").show("slow").siblings().hide("slow"); $('a').click(function () { event.preventDefault(); var divname = this.name; $("#" + divname).show("slow").siblings().hide("slow"); }); $('#seeAll').click(function() { $('#div2').show("slow") $('#div3').show("slow") $('#div4').show("slow") $('#div5').show("slow") $('#div7').show("slow") $('#div8').show("slow") $('#div9').hide("slow") }) }); 

  <a class="people-letters" href="#" name="div2">A</a> <a class="people-letters" href="#" name="div3">B</a> <a class="people-letters" href="#" name="div4">C</a> <a class="people-letters" href="#" name="div5">D</a> EFGHIJKLMNOPQR <a class="people-letters" href="#" name="div7">S</a> TUV <a class="people-letters" href="#" name="div8">W</a> XYZnbsp;<a id="seeAll" class="people-letters" href="#">See All</a> <div> <div id="div2" style="display: none;"> div2 </div> <div id="div3" style="display: none;"> div3 </div> <div id="div4" style="display: none;"> div4 </div> <div id="div5" style="display: none;"> div5 </div> <div id="div7" style="display: none;"> div7 </div> <div id="div8" style="display: none;"> div8 </div> <div id="div9" style="display: none;"> div9 </div> </div> <a href="http://google.com/">Sample Link</a> 

Answer 1

EDIT:

You have bound your click event to ALL link elements by specifying 'a' as your selector. in order to bind it only to that specific link you can use your class that you've specified for the links that hide and show the div elements.

$('a.people-letters').click(function (event) {
    event.preventDefault();
    var divname = this.name;
    $("#" + divname).show("slow").siblings().hide("slow");
});