tutorials.de - Elemente zu mehreren Tags hunzufügen

by SpiceLab

HTML

<h1 class="testing">APPEND</h1>
   <p>Hallo, ich bin ein P TAG </p>
   <h1 class="testing">APPEND2</h1>
   <p>BADGL</p>
   <input type="button" value="append tag/text " onclick="$('p').append('<ul><li>RIBA RIBI<ul><li>FRANK RIBERY</li></ul></li></ul> <h1>NIGOGOG</h1> <span>ich sollte appendet</span>');" />

CSS

p * {font-size:.9rem;color:red}

JavaScript

function $(selector) {
 
   var resultObject = {
       append: function (element) {
           var parser = new DOMParser();
           var dos = parser.parseFromString(element, "text/html");
 
           var all = dos.getElementsByTagName("body")[0];
   
           var elemWhichAppend = document.getElementsByTagName(selector);
 
           var children = all.childNodes;
 
 
 
         
           for (var i = elemWhichAppend.length-1; i >=0; i--) {
 
               var msgContainer = document.createDocumentFragment();
               var children = all.childNodes;
 
               for (var child = 0; child < children.length; child++) {
                   var al = children[child];
                   msgContainer.appendChild(al);
               }
               insertAfter(msgContainer, elemWhichAppend[I]);
 
           }
 
 
 
       }
   }
   return resultObject;
}
function insertAfter(newNode, referenceNode) {
   referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}