jQuery - Удаление всех якорных меток с определенным классом из div

Question

В некоторых случаях и по причинам, выходящим за рамки этого вопроса, привязки повторяются. Вот пример ДИВ:

<div class="unifyRepeat listing"> 
    <a class="businessAnchor" name="abcchildcareandlearningcenter"></a> 
    <a class="businessAnchor" name="abcchildcareandlearningcenter"></a> 
    <a class="businessAnchor" name="abcchildcareandlearningcenter"></a> 
    <a class="businessAnchor mceItemAnchor" name="abcchildcareandlearningcenter"></a> 
    <table class="tblListing"> 
     <tbody> 
      <tr> 
       <td> 
        <p class="bold">ABC Child Care and Learning Center</p> 
        <p>Jane Smith</p> 
        <p>(555) 555-1234</p> 
       </td> 
       <td> 
        <img alt="" src="images/ABCchildcare.jpg"> 
       </td> 
       <td> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
    <a class="linkToTop" href="#top">^ Top</a> 
</div> 

Вот JQuery, который добавляет якорь и пытается удалить любые существующие:

$('#businessListings div.listing').each(function() { 
    var name = $(this).find('p:first').text(), 
     cleanedName = name.replace(/\W/g, '').toLowerCase(); 

    $('ul#businessListingLinks').append('<li><a href="#' + cleanedName + '">' + name + '</a>'); 

    var anchor = '<a class="businessAnchor" name="' + cleanedName + '"></a>'; 
    $(this).remove('a.businessAnchor'); 
    //$(this).each('a.businessAnchor').remove(); 
    $(this).prepend(anchor); 
}); 

Я думал, что линия удалить() будет выбрать все якоря теги с класс «businessAnchor», но это не так.

Как вы можете видеть, я попробовал функцию each(), но это не сработало. Я не уверен, что это потому, что я не реализовал его должным образом или по какой-то другой причине.

Answer 1

Попробуйте это:

$(this).find('a.businessAnchor').remove(); 

Так, из разметки, кажется, что a.businessAnchor являются прямым потомком DIV, так что вы можете сделать это слишком:

$(this).children('a.businessAnchor').remove();