title: Customize active tab with jquery / javascript
body: <p>I'm trying to modify the script of the vertical tabs on this page <a href="http://www.bluimage.it/dev/" rel="nofollow">http://www.bluimage.it/dev/</a> to put an arrow on the right of the tab as I can show the active/selected one. I try to call a css class as shown (note "case "left:"):</p>
  
  <pre><code>    function showContentDesc(modid, ind, pos)
  {
          i = 0;
          switch(pos)
          {
              case "top":
                  thisstyle=document.getElementById("menu_" + modid + "_" + ind).style.borderBottom;
                  while (document.getElementById("content_" + modid + "_" + i) != null) {
                      document.getElementById("content_" + modid + "_" + i).style.display = "none";
                      document.getElementById("menu_" + modid + "_" + i).style.borderBottom = thisstyle;
                      i++;
                  }
                  document.getElementById("menu_" + modid + "_" + ind).style.borderBottom = "none";
                  break;
              case "bottom":
                  thisstyle=document.getElementById("menu_" + modid + "_" + ind).style.borderTop;
                  while (document.getElementById("content_" + modid + "_" + i) != null) {
                      document.getElementById("content_" + modid + "_" + i).style.display = "none";
                      document.getElementById("menu_" + modid + "_" + i).style.borderTop = thisstyle;
                      i++;
                  }
                  document.getElementById("menu_" + modid + "_" + ind).style.borderTop = "none";
                  break;
              case "right":
                  thisstyle=document.getElementById("menu_" + modid + "_" + ind).style.borderLeft;
                  while (document.getElementById("content_" + modid + "_" + i) != null) {
                      document.getElementById("content_" + modid + "_" + i).style.display = "none";
                      document.getElementById("menu_" + modid + "_" + i).style.borderLeft = thisstyle;
                      i++;
                  }
                  document.getElementById("menu_" + modid + "_" + ind).style.borderLeft = "none";
                  break;
              case "left":
              default:
                  thisstyle=document.getElementById("menu_" + modid + "_" + ind).style.borderRight;
                  while (document.getElementById("content_" + modid + "_" + i) != null) {
                      document.getElementById("content_" + modid + "_" + i).style.display = "none";
                      document.getElementById("menu_" + modid + "_" + i).style.borderRight = thisstyle;
                      i++;
                  }
                  document.getElementById("menu_" + modid + "_" + ind).className = "sliptabs-left-menuitem-container-active";
                  break;
          }
          document.getElementById("content_" + modid + "_" + ind).style.display = "inline";
  }
  </code></pre>
  
  <p>...and it works, but when i go to other tabs the selected in past tab remain actived! how can I deactivate the other ones and set the active only in that in which I am?</p>