jQuery特定のサブクラスのタグ<a>を削除します

Question

特定のクラスから<a>タグを削除しました。ここに私のHTMLは次のとおりです。だから、

<div class="my_class"> 
    <div class="sub_class"> 
     <p class="percent">0%</p> 
    </div> 
    <div> 
     <div id="my_links_1"> 
      <p class="my_url"><a href="#">my link 1</a></p> 
      <p class="my_url"><a href="#">my link 2</a></p> 
     </div> 
    </div> 
    <div class="sub_class"> 
     <p class="percent">50%</p> 
    </div> 
    <div> 
     <div id="my_links_2"> 
      <p class="my_url"><a href="#">my link 3</a></p> 
      <p class="my_url"><a href="#">my link 4</a></p> 
     </div> 
    </div> 
    <div class="sub_class"> 
     <p class="percent">50%</p> 
    </div> 
    <div> 
     <div id="my_links_3"> 
      <p class="my_url"><a href="#">my link 5</a></p> 
      <p class="my_url"><a href="#">my link 6</a></p> 
     </div> 
    </div> 
    <div class="sub_class"> 
     <p class="percent">100%</p> 
    </div> 
    <div> 
     <div id="my_links_4"> 
      <p class="my_url"><a href="#">my link 7</a></p> 
      <p class="my_url"><a href="#">my link 8</a></p> 
     </div> 
    </div> 
</div> 

、私が望んでいたことの割合が50％である以外のすべての<a>タグを削除することでした。私はこのコードを試しましたが、すべて<a>タグが削除されました。

$.each($('.percent'), function (index, value) { 
    var per = $(value).text(); 
    if(per != "50%"){ 
     $(".my_url").find("a").contents().unwrap(); 
    } 
}); 

Answer 1

あなたはそのための適切なselectorを使用する必要があります。
は確認以下

$('.percent').each(function() { 
 
    var per = $(this).text(); 
 
    if (per != "50%") { 
 
    $(this).parent('div').next().find(".my_url").find("a").contents().unwrap(); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="my_class"> 
 
    <div class="sub_class"> 
 
    <p class="percent">0%</p> 
 
    </div> 
 
    <div> 
 
    <div id="my_links_1"> 
 
     <p class="my_url"><a href="#">my link 1</a> 
 
     </p> 
 
     <p class="my_url"><a href="#">my link 2</a> 
 
     </p> 
 
    </div> 
 
    </div> 
 
    <div class="sub_class"> 
 
    <p class="percent">50%</p> 
 
    </div> 
 
    <div> 
 
    <div id="my_links_2"> 
 
     <p class="my_url"><a href="#">my link 3</a> 
 
     </p> 
 
     <p class="my_url"><a href="#">my link 4</a> 
 
     </p> 
 
    </div> 
 
    </div> 
 
    <div class="sub_class"> 
 
    <p class="percent">50%</p> 
 
    </div> 
 
    <div> 
 
    <div id="my_links_3"> 
 
     <p class="my_url"><a href="#">my link 5</a> 
 
     </p> 
 
     <p class="my_url"><a href="#">my link 6</a> 
 
     </p> 
 
    </div> 
 
    </div> 
 
    <div class="sub_class"> 
 
    <p class="percent">100%</p> 
 
    </div> 
 
    <div> 
 
    <div id="my_links_4"> 
 
     <p class="my_url"><a href="#">my link 7</a> 
 
     </p> 
 
     <p class="my_url"><a href="#">my link 8</a> 
 
     </p> 
 
    </div> 
 
    </div> 
 
</div>