jquery - Trouble with show/hide JavaScript -


i going have expressionengine weblog place user designed content blocks in footer. but, it's going show 1 @ at time.

my html looks this:

<ul class="footernav">     <li class="first"><a class="active" href="#">get in touch</a></li>     <li><a href="#">interested in joining?</a></li>     <li><a href="#">feedback</a></li>     <li><a href="#">link 4</a></li> </ul> <div class="copy gutters show">     <p>lorem ipsum</p> </div> <div class="copy gutters hide">     <p>lorem ipsum</p> </div> <div class="copy gutters hide">     <p>lorem ipsum</p> </div> 

i want switch show class hide class depending on clicked link. not sure how can accomplish this. has flexible enough work n number of content blocks--because defined user in expressionengine.

i'm pretty brand new javascript appreciate insight, or solution how might accomplish this.

i think work structure:

// cycle through each link in our ul.footernav element $(".footernav a").each(function(i,o){   // attach click-logic each link   $(this).click(function(e){     // prevent page bouncing, reloading, etc.     e.preventdefault();     // add .active class this, remove other links     $(this).addclass("active").closest("li").siblings("li").find("a").removeclass("active");     // show div having class .copy , same index clicked link     // meaning, clicking second link show second div     $("div.copy:eq("+i+")").show().siblings("div.copy").hide();   }); }); 

demo online: http://jsbin.com/ekecu


Comments

Popular posts from this blog

c++ - Convert big endian to little endian when reading from a binary file -

C#: Application without a window or taskbar item (background app) that can still use Console.WriteLine() -

unicode - Are email addresses allowed to contain non-alphanumeric characters? -