jQuery - méthode insertAfter (sélecteur)

La description

le insertAfter( selector ) La méthode insère tous les éléments correspondants après un autre ensemble d'éléments spécifié.

Syntaxe

Voici la syntaxe simple pour utiliser cette méthode -

selector.insertAfter( selector )

Paramètres

Voici la description de tous les paramètres utilisés par cette méthode -

  • selector - Contenu après lequel le ou les éléments sélectionnés sont insérés.

Exemple

Voici un exemple simple montrant l'utilisation de cette méthode. Ceci insère un élément de division avec l'ID de "source" après un élément sur lequel on a cliqué.

<html>
   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
         src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
      </script>
		
      <script type = "text/javascript" language = "javascript">
         $(document).ready(function() {
            $("div").click(function () {
               $("#source").insertAfter(this);
            });
         });
      </script>
		
      <style>
         .div{ margin:10px;padding:12px; border:2px solid #666; width:60px;}
      </style>
   </head>
	
   <body>
      <p>Click on any square below to see the result:</p>
		
      <div class = "div" id = "source"></div>
      <div class = "div" style = "background-color:blue;"></div>
      <div class = "div" style = "background-color:green;"></div>
      <div class = "div" style = "background-color:red;"></div>
   </body>
</html>

Cela produira le résultat suivant -

jquery-dom.htm