My first jquery -- Tabs
My first jquery -- Tabs
Newbee question.
I'm converting old javascript to use JQuery. I know their are plugins for this but I'm learning by doing.
First Instead of going through the loop, is their something like this?
$("div.tabs").className = "tabs";
Second: How do I write this using addClass
document.getElementById("tab"+(id)).className = 'tabs current';
Markup
- <div id="tab1" class="tabs current">
- <a onclick="return switch_tabs('1');" href="#">Description</a>
- </div>
- <div id="tab2" class="tabs">
- <a onclick="return switch_tabs('2');" href="#">Reviews</a>
- </div>
- <br class="clear">
- <div id="tab_content">
- <div id="tab_content1" style="display: block" class="product-description">
- &mvt:product:descrip;
- </div>
- <div id="tab_content2" style="display: none" class="product-reviews">
- &mvt:product:name;
- <br><br><br>
- </div>
- </div>
Working Javascript.
- function switch_tabs(id) {
- var count = $("div.tabs").length;
- for (i=1; i <= count; i++) {
- document.getElementById("tab"+(i)).className = "tabs";
- document.getElementById("tab_content"+(i)).style.display = "none";
- }
- document.getElementById("tab"+(id)).className = 'tabs current';
- document.getElementById("tab_content"+(id)).style.display = 'block';
- return false;
- }