アクティブなタブにクラスを表示する休憩タブのクラスを持たない

Question

この例では、 ".active"クラスと ".inactive"クラスを使用しますが、タブをクリックするだけで ".active"クラスを表示したい".inactive" を適用、どのように私は、コードの状態ここで

//------ Tabs 
       $('#tabs li:first-child a').addClass('active'); 
     $('#tabs li a:not(:first)').addClass('inactive'); 
       $('.tab-container').hide(); 
       $('.tab-container:first').show(); 

       $('#tabs li a').click(function(){ 
        var t = $(this).attr('id'); 

        if(!$(this).hasClass('active')){ //this is the start of our condition 

      $('#tabs li a').removeClass('active').addClass('inactive');   
        $(this).removeClass('inactive').addClass('active'); 

        $('.tab-container').hide(); 
        $('#'+ t + 'C').fadeIn('slow'); 
       } 
       }); 

JSFiddle Here

Answer 1

から ".inactive" クラスを削除することができそうです！

$('#tabs li:first-child a').addClass('active'); 
    $('.tab-container').hide(); 
    $('.tab-container:first').show(); 
    $('#tabs li a').click(function(){ 
        var t = $(this).attr('id'); 
       if(!$(this).hasClass('active')){        
         $('#tabs li a').removeClass('active');   
         $(this).addClass('active'); 

         $('.tab-container').hide(); 
         $('#'+ t + 'C').fadeIn('slow'); 
        } 
       });