Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JS DOM equivalent for JQuery append

Tags:

What is the standard DOM equivalent for JQuery

element.append("<ul><li><a href='url'></li></ul>")?

like image 753
Battery Avatar asked Apr 25 '12 14:04

Battery


People also ask

What is the alternative for append in JavaScript?

replaceChildren() is a convenient alternative to innerHTML and append() append() appends nodes to the parent node. The contents that were inside the node before the append() invocation remain preserved.

Is append JavaScript or jQuery?

The jQuery append() method lets you insert content (either an element or a string) at the end of each element in a set of matching elements.

Is there append in JavaScript?

Introduction to JavaScript append() methodThe append() method will insert DOMString objects as Text nodes. Note that a DOMString is a UTF-16 string that maps directly to a string. The append() method has no return value. It means that the append() method implicitly returns undefined .

What is append in jQuery?

jQuery append() Method The append() method inserts specified content at the end of the selected elements. Tip: To insert content at the beginning of the selected elements, use the prepend() method.


1 Answers

I think you have to extend the innerHTML property to do this

element[0].innerHTML += "<ul><li><a href='url'></a></li></ul>"; 

some explanation:

  • [0] needed because element is a collection
  • += extend the innerHTML and do not overwrite
  • closing </a> needed as some browsers only allow valid html to be set to innerHTML

Hint: As @dontdownvoteme mentioned this will of course only target the first node of the collection element. But as is the nature of jQuery the collection could contain more entries

like image 133
Tobias Krogh Avatar answered Sep 21 '22 04:09

Tobias Krogh