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');
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
Post a Comment