Comment créer un élément div en jQuery ?

La bibliothèque jQuery fournit différents opérateurs permettant de sélectionner un élément HTML facilement.

jQuery fournit des méthodes permettant de créer facilement un élément HTML et de l'ajouter à un autre élément. La première chose à faire est de sélectionner l'élément dans lequel on souhaite insérer une nouvelle balise. Pour cela, jQuery fournit différents opérateurs permettant de sélectionner un élément facilement (à voir aussi comment changer l'image d'arrière-plan d'une DIV en jQuery).

L'opérateur # permet de sélectionner un élément en fonction de son identifiant. L'identifiant d'un élément étant unique dans une page internet, il s'agit de la méthode la plus efficace pour sélectionner un élément. On peut également utiliser l'opérateur . pour sélectionner des éléments en fonction de la classe CSS qui leur est attribuée. Si on ne précise aucun opérateur, on peut sélectionner un élément avec son nom (div, table...). Dans les deux derniers cas, on obtiendra un tableau avec la liste des éléments correspondants et il faudra préciser un index pour choisir l'élément.

On peut ensuite utiliser la méthode append(), qui permet d'ajouter l'élément entre parenthèses comme enfant de l'élément qui a appelé la méthode. On peut également avec la méthode appendTo() intégrer l'élément qui a appelé la méthode à l'élément en paramètre. Si on crée l'élément avec le sélecteur jQuery, il est possible en deuxième paramètre de spécifier les attributs de l'élément.

//Exemple avec la méthode append :
jQuery(monElement).append('<div id=maDiv class=classe>Coucou</div>');
//Exemple avec la méthode appendTo :
jQuery(<div/>, {id : 'maDiv', class: 'classe', text: 'Coucou'}).appendTo(monElement);

JQuery