javascript - siblings() は ul li の下のリンクでは機能しません

Question

このjqueryコードでアクティブになっているときに強調表示する2つのサブメニューがあります。

<script type="text/javascript">
$(document).ready(function(){
    $('#links').click(function(){
        $(this).addClass('selected');
        $(this).siblings().removeClass('selected');
    });
})
 </script>

しかし、同じコードを使用したい別のサブメニューがありますが、リンクがliタグの下にあるため、siblings()関数が機能しないため、機能しません! そして、これが私が試したコードです：

<script type="text/javascript">
$(document).ready(function(){
    $('.tabs_rubriken  a').click(function(){
        $(this).addClass('selected');
        $(this).siblings().removeClass('selected');
    });
})
 </script>

それらをクリックすると強調表示されますが、そのメニューで他のリンクをクリックしても「選択された」クラスは削除されません。ちなみにこのメニューはulliで注文する必要があります。

マークアップ:

<div id="tab2">
<ul class="tabs_rubriken">
    <li><a class="submenu_produkts_links2" href="#armreifen">Armreifen</a></li>
    <li><a class="submenu_produkts_links2" href="#colliers">Colliers Anhänger</a></li>
    <li><a class="submenu_produkts_links2" href="#ohrschmuck">Ohrschmuck</a></li>
    <li><a class="submenu_produkts_links2" href="#ringe">Ringe</a></li>
</ul>
<div id="armreifen">[tabs slidertype="images" auto="yes" autospeed="4000"]
[imagetab width="800" height="500"] image.png [/imagetab]
[imagetab width="800" height="500"] image.png [/imagetab]
[/tabs]</div>
<div id="colliers">Colliers Anhänger</div>
<div id="ohrschmuck">Ohrschmuck</div>
<div id="ringe">Ringe</div>
</div>