Anzeigen und verstecken Registerkarte Inhalt auf klicken

Question

Hallo Ich habe derzeit die folgende Einrichtung - https://jsfiddle.net/scwbqffo/ Klicken Sie auf eine Registerkarte würde Inhalt anzeigen und zwischen den Tabs wechseln (Nicht sicher, warum es nicht in der Geige funktioniert aber auf meiner Website funktioniert).

Ich möchte in der Lage sein, auf die Registerkarte erneut zu klicken, um es zu schließen, wenn möglich?

$(document).ready(function(){ 
    $("ul#tabs li").click(function(e){ 
     if (!$(this).hasClass("active")) { 
      var tabNum = $(this).index(); 
      var nthChild = tabNum+1; 
      $("ul#tabs li.active").removeClass("active"); 
      $(this).addClass("active"); 
      $("ul#tab li.active").removeClass("active"); 
      $("ul#tab li:nth-child("+nthChild+")").addClass("active"); 
     } 
    }); 
}); 

<ul id="tabs"> 
    <li>Show tab 1</li> 
    <li>Show tab 2</li> 

</ul> 
<ul id="tab"> 
    <li>showing tab 1 content</li> 
    <li>showing tab 2 content</li> 
</ul> 

ul#tabs { 
    list-style-type: none; 
    padding: 0; 
    text-align: center; 
} 
ul#tabs li { 
    display: inline-block; 
    background-color: #252525; 
    border-bottom: solid 2px grey; 
    padding: 10px 20px; 
    margin-bottom: 4px; 
    color: #fff; 
    cursor: pointer; 
} 
ul#tabs li:hover { 
    background-color: grey; 
} 
ul#tabs li.active { 
    background-color: #00aeef; 
} 
ul#tab { 
    list-style-type: none; 
    margin: 0; 
    padding: 0; 
} 
ul#tab li { 
    display: none; 
} 
ul#tab li.active { 
    display: block; 
} 

Answer 1

eine else in Ihrem jquery hinzufügen, die die active Klasse entfernt

else { 
    $(this).removeClass('active'); 
    $("ul#tab li.active").removeClass("active"); 
} 

jsfiddle

Answer 2

Sie fehlen jQuery in der jsFiddle, um Ihre Frage zu beantworten, die Sie brauchen nur toggleClass verwenden