JQuery Show/Hide issue -


i have few links change content in div upon click. now, 1 of links has new content , trying replace existing div new 1 follows

var terms = document.getelementsbyclassname("tos")[0]; var faqs = document.getelementsbyclassname("faq")[0]; $(terms).click(function(){  $("#menuitem").hide();  $("#newterms").show(); }); $(faqs).click(function(){  $("#newterms").hide();  $("#menuitem").show(); }); 

the idea hide #newterms when link other 'terms' clicked.

the above code hides #newterms altogether , not show new div when click on 'terms'. i'm not familiar jquery , not sure doing wrong. great if of can me out this.

sorry, here html

<div id="contenttext">  <div id="menuitem"></div>  <div id="newterms">   <p id="terms_header">header</p>   <div id="termsconds">terms</div>  </div> </div> 

i did search , found classnames can accessed way (above).

use jquery selectors, here working jsfiddle. when selecting elements via jquery # or 'hash' id attribute . or 'period' class attribute.

so $('.class-name'); or $('#id-name');

http://jsfiddle.net/gdswx/1/

html

<a class="tos" href="#">tos</a> <br> <a class="faq" href="#">faq</a>  <div id="contenttext">     <div id="menuitem">menu item</div>     <div id="newterms">         <p id="terms_header">header</p>         <div id="termsconds">terms</div>     </div> </div> 

javascript

var terms = $('.tos'); var faqs = $('.faq');  $(terms).click(function () {     $("#menuitem").hide();     $("#newterms").show(); });  $(faqs).click(function () {     $("#newterms").hide();     $("#menuitem").show(); }); 

if want hide 1 of 2 perform hide/show after document has loaded.

$(document).ready(function() {     $("#newterms").hide();     $("#menuitem").show(); }); 

Comments

Popular posts from this blog

iphone - Three second countdown in cocos2d -

hyperlink - how to do url routing in php -

c - Avoiding Extra Malloc in Linked List (node->next = NULL) -