Показать и скрыть вкладку на вкладке

Question

Привет У меня есть следующая настройка: https://jsfiddle.net/scwbqffo/ Нажав на любую вкладку, вы сможете отображать содержимое и переключаться между вкладками (не уверен, почему он не работает на скрипке, но отлично работает на моем сайте).

Я хочу, чтобы иметь возможность нажимать на вкладку еще раз, чтобы закрыть ее, если возможно?

$(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

Добавить в вашем JQuery в else, удаляющий active класс

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

jsfiddle

Answer 2

У вас не хватает JQuery в jsFiddle, чтобы ответить на ваш вопрос, вам просто нужно использовать toggleClass