jQuery entfernen <a> Tag aus bestimmten Unterklasse

Question

Ich wollte das <a> Tag aus bestimmten Klassen entfernen. Hier ist mein 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> 

Also, was ich wollte, war entfernen Sie alle <a> Tags außer dem Prozentsatz 50% beträgt. Ich habe versucht mit diesem Code, aber es hat alle <a> Tags entfernt.

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

Answer 1

Sie müssen, dass geeignete selector für verwenden:
die unter

$('.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>