Un moyen plus simple d'obtenir un objet jQuery à partir d'un élément ajouté

Question

Existe-t-il un moyen plus simple / rapide d’obtenir l’élément ajouté à l’aide de jQuery append:

Comment obtenir l'élément $ selectors:

 $container.append('<div class="selectors"></div>');
var $selectors = $('.selectors', $container);
 

J'ai essayé:

 var $selectors = $container.append('<div class="selectors"></div>');
 

mais cela rend $ selectors = $ container

Peut-être que c'est le moyen le plus rapide / meilleur. Je vérifie juste.

Answer 1

Pourquoi pas simplement:

 var el = $('<div class="selectors"></div>');
$container.append(el);
 

?

Ensuite, vous avez accès à 'el'.

Answer 2

C'est ma façon préférée de le faire:

 var $selectors = $('<div class="selectors"></div>').appendTo(container);
 

Answer 3

$selectors = $('<div/>').addClass('selectors').appendTo($container);

Answer 4

Vous pouvez également créer une nouvelle fonction jQuery pour faire ça:

jQuery.fn.addChild = function(html) 
{                               
    var target  = $(this[0])                            
    var child = $(html);                                                      
    child.appendTo(target);                                                   
    return child;                                                             
};  

et puis l'utiliser comme ceci:

$('<ul>').addChild('<li>hi</li>');

bien sûr, si vous voulez ajouter plus d'un élément:

var list = $('<ul>');
list.addChild('<li>item 1</li>');
list.addChild('<li>item 2</li>');

L'avantage des approches de ce type est que plus tard, vous pouvez ajouter d'autres à la "méthode addChild" fonction si vous le souhaitez. À noter que pour les deux exemples ci-dessus, vous devez ajouter l'élément dans le document, de sorte qu'un exemple complet pourrait être:

$('body').addChild('<ul>').addChild('<li>hi</li>');