title: How to make JQuery + CSS Vertical Tabs
body: <p>Having trouble with my tabs, the Jquery is not functioning as i expect it to.</p>
  
  <p>Im trying to create verticle tabs to display different information, but my jquery is not functioning.</p>
  
  <ol>
  <li>I am trying to hide all the divs except the first one.</li>
  <li>Then when one of the tab lists is clicked the active class gets added to that and removed from the other.</li>
  <li>finally hide all the divs and show the one which was clicked.</li>
  </ol>
  
  <p><a href="http://jsfiddle.net/KHAN/HjYZ6/2/" rel="nofollow">Click for jsfiddle demo</a></p>
  
  <pre><code>   $(document).ready(function() {
      tabContent();
  })
  
  function tabContent() {
      $('#tabsD div:not(:first)').hide(); 
      $('#tab-container li').click(function(event){
          var id = $(event.target).index();
          $('.active').removeClass('active');
          $(event.target).addClass('active');
          $('#tabsD div').hide().eq(id).show();
      });
  }
  </code></pre>