Wie wird ein Element aus einer Auswahl mit Jquery/Javascript vor dem Anhängen an ein anderes Element entfernt?

Question

Ich habe eine Gruppe von Schaltflächen, denen ich dynamisch Schaltflächen hinzufüge. Meine Auswahl wird wie folgt aussehen:

$elements = [a.midToggle, a.menuToggle, a.ui-crumbs] 

Ich möchte diese Auswahl zu einem bestehenden Kontrollgruppe vorangestellt wird:

<div data-role="controlgroup" data-type="horizontal" class="dropZone"> 
    <a href="#" class="some">Some</a> 
    <a href="#" class="midToggle">MidTog</a> 
</div> 

Doch bevor das Voranstellen möchte ich die Tasten bereits in der Kontrollgruppe von meiner Auswahl entfernen weil sie sonst mehrmals da drin sind.

Ich bin wie dieser versucht, aber es hat nicht funktioniert:

// I have multiple controlgroups, so I need to add the buttons to all of them 
$('.dropZone').each(function() {  

    var $first = $(this), 
    $buttons = $elements.clone(); 

    $buttons.each(function() { 
    // check if class name on new button is already in controlgroup 
    if ($(this).is(".midToggle") && $first.find(".midToggle").length > 0) { 
    $(this).remove(); 
     } 
     if ($(this).is(".menuToggle") && $first.find(".menuToggle").length > 0) { 
    $(this).remove(); 
     } 
     if ($(this).is(".ui-crumbs") && $first.find(".ui-crumbs").length > 0) { 
    $(this).remove(); 
     } 
     }); 
// append what's left 
$first.append($buttons) 

Ich schätze meine $ Tasten nicht entfernt werden, aber ich weiß nicht, wie es zu erhalten, Arbeit. Auch meine drei if-Statements sind irgendwie lahm. Gibt es einen besseren Weg, dies zu tun?

EDIT:
ich die Lösung ein wenig modifizieren musste, da jede Taste mehrere Klassen hat, so kann ich einfach nicht, für attr (‚class‘). Dies ist nicht perfekt, aber funktioniert:

function clearOut($what) { 
    $buttons.each(function() { 
     if ($(this).is($what)) { 
      $buttons = $buttons.not($what) 
      } 
     }); 
    } 

// filter for existing buttons 
// TODO: improve 
if ($first.find('.midToggle')) { 
    clearOut('.midToggle'); 
    } 
if ($first.find('.menuToggle')) { 
    clearOut('.menuToggle'); 
    } 
if ($first.find('.ui-crumbs')) { 
    clearOut('.ui-crumbs'); 
    } 

Answer 1

ich Ihren Code in Hälfte kreischte:

$('.dropZone').each(function() { 
    var $dropZone = $(this); 
    var $buttons = $elements.clone(); 
    $buttons.each(function() { 
     var $button = $(this); 

     if ($dropZone.find('.' + $button.attr('class')).length) 
      $button.remove(); 
    }); 

    $dropZone.append($buttons); 
});​ 

Answer 2

$('.dropZone').each(function() {  
    $buttons = $elements.filter(function() { 
     if ($('.'+this.className).length) return this; 
    }); 
    $(this).append($buttons); 
});