Ajout exemple 'ajout d'élément par .append() et .appendTo()'

exemples/jquery/insertion-append-et-appendto/config.json

@@ -0,0 +1,10 @@
+{
+  "slug": "insertion-append-et-appendto",
+  "title": "Insertion : append et appendTo",
+  "category": "misc",
+  "html": [ "example.html" ],
+  "js": [ "script.js" ],
+  "css": [],
+  "libsJs": [ "jquery-3.2.1.min.js" ],
+  "libsCss": [ "styles.css" ]
+}

exemples/jquery/insertion-append-et-appendto/example.html

@@ -0,0 +1,4 @@
+<!-- Insertion : append et appendTo -->
+<div id="cible">
+  <p>1er paragraphe</p>
+</div>

exemples/jquery/insertion-append-et-appendto/script.js

@@ -0,0 +1,13 @@
+// Insertion : append et appendTo
+
+// Si on ne souhaite rien faire sur le nouvel élément pour l' instant
+$('#cible').append('<p>2ème paragraphe</p>');
+$('<p>3ème paragraphe</p>').appendTo('#cible');
+
+// Si on souhaite au contraire le manipuler directement
+// a) manipulation directe
+$('<p>4ème paragraphe</p>').appendTo('#cible').css('color', '#67bdba');
+// b) stockage dans une variable et manipulation, pratique si on veut
+//    garder cette variable pour agir dessus plus tard
+var p = $('<p>5ème paragraphe</p>').appendTo('#cible');
+p.css({ color: '#eae', backgroundColor: '#333', padding: '5px', borderRadius: '5px' });