[解決済み] jQueryで簡単なタブを作るには？

質問

次のようなコードがあります。 フィドル

これは、私が自分で作成したウェブサイトでは、JSなしで、タブが関連するセクションへのジャンプリンクとして機能し、とても便利です。しかし、現在使用している特注のCMSに設置すると、ジャンプリンクが機能しません。タブに相対リンクを追加してみたところ、JSなしでも動作するようになりましたが、JSを使用するとタブコンテンツが表示されなくなりました。

何か見落としているのでしょうか？

htmlを使用します。

<ul id="tabs">

      <li><a href="#tab1">test1</a></li>
      <li><a href="#tab2">test2</a></li>
      <li><a href="#tab3">test3</a></li>
      <li><a href="#tab4">test4</a></li>

</ul>
      <div class="container" id="tab1">Some content</div>
      <div class="container" id="tab2">Some content</div>
      <div class="container" id="tab3">Some content</div>
      <div class="container" id="tab4">Some content</div>

jQueryです。

$('#tabs li a:not(:first)').addClass('inactive');
$('.container').hide();
$('.container:first').show();
$('#tabs li a').click(function(){
    var t = $(this).attr('href');
    $('#tabs li a').addClass('inactive');        
    $(this).removeClass('inactive');
    $('.container').hide();
    $(t).fadeIn('slow');
    return false;
})

if($(this).hasClass('inactive')){ //this is the start of our condition 
    $('#tabs li a').addClass('inactive');         
    $(this).removeClass('inactive');
    $('.container').hide();
    $(t).fadeIn('slow');    
}

解決方法は？

私はあなたのウェブサイトは、hrefで問題を抱えている推測している、私はユーザーがhrefをクリックしたときに、ウェブサイトが自動的に自分自身を根絶することを前提としています。

新しい解決策のjsFiddleはこちらです。

新しいソリューションがあります。

jQueryを更新しました。

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

  if($(this).hasClass('inactive')){ //this is the start of our condition 
    $('#tabs li a').addClass('inactive');           
    $(this).removeClass('inactive');

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

新しい html マークアップ。

<ul id="tabs">

      <li><a id="tab1">test1</a></li>
      <li><a id="tab2">test2</a></li>
      <li><a id="tab3">test3</a></li>
      <li><a id="tab4">test4</a></li>

</ul>
<div class="container" id="tab1C">1Some content</div>
<div class="container" id="tab2C">2Some content</div>
<div class="container" id="tab3C">3Some content</div>
<div class="container" id="tab4C">4Some content</div>