DIVの子に.activeクラスを追加し、非アクティブなIDを削除する

Question

クラスを持つDIVの子にIDを追加するにはどうすればよいでしょうか。

クラス "タブペイン"を持つDIVでも "アクティブ"クラスがある場合、ID "target"をクラス "template1"（または "template2"にアクティブ）に割り当てたいと思います。他のタブをクリックすると、「ターゲット」が他の場所に割り当てられているかどうかを確認する必要があります。 https://jsfiddle.net/7c8aek90/

これまでHTML

<div id="Tabbie"> 
    <ul class="nav nav-tabs" id="styleTab"> 
    <li class="active"> 
     <a data-toggle="tab" href="#1">Tab 1</a> 
    </li> 
    <li> 
     <a data-toggle="tab" href="#2">Tab 2</a> 
    </li> 
    </ul> 
    <div class="tab-content"> 
    <div class="tab-pane active" id="1"> 
     <div class="row"> 
     <div class="col-md-6 templateContent"> 
      <div class="template1"> 
      Text 
      </div> 
     </div> 
     <div class="col-md-6 textContent"> 
      Text 
     </div> 
     </div> 
    </div> 
    <div class="tab-pane" id="2"> 
     <div class="row"> 
     <div class="col-md-6 templateContent"> 
      <div class="template2"> 
      Text 
      </div> 
     </div> 
     <div class="col-md-6 textContent"> 
      Text 
     </div> 
     </div> 
    </div> 
    </div> 
</div> 

私のjQueryの

if ($("div.tab-pane").hasClass('active')) { 
    $("div.tab-pane").find("div:eq(2)").attr('id', 'target'); 
} else { 
    $("div.tab-pane").find("div:eq(2)").removeAttr('id', 'target'); 
} 

ありがとう：ここ

はフィドルです！

Answer 1

アイデアは、属性id = "target"を追加するそれぞれにダミークラスを追加することです。 このフィディーズをチェック

Visit [Fiddle] (https://jsfiddle.net/s0e121hd/1/)!