Query append() VS appendTo()

Query append() and appendTo()

append() :  Append to end of the selected element

HTML :   <ul id=”test”>
<li>test</li>
</ul>
JQuery :   jQuery(“#test”).append(“<li>test1</li>”);

OUTPUT :  <ul id=”test”>
<li>test</li>
<li>test1</li>
</ul>
appendTo :  Append to end of the selected element

HTML :   <div>Hello</div>

JQuery :  $(‘<p>Test</p>’).appendTo(‘.inner’);

OUTPUT :  <div  class=”inner” > Hello
<p>Test</p>
</div>

Difference:
Both jQuery append() and appendTo() methods are doing the same task, add a text or html
content after the content of the matched elements. The major difference is in the syntax.

//Create our content
var appendHTML = “<p>I’m going to be added to the DOM</p>”;

//Select our element, then add the html
$(“#container”).append(appendHTML);

//Create our content, then select the element to append to
$(appendHTML).appentTo(“#container”);