Basically, using this method, we can add a new element as the direct child of an element which will appear as its last item.
Note: as mentioned before, using this method will put the new element as the last element. Now if we want to set an element as the child of another element but not necessarily as its last child, we can use the insertBefore() method.
Element appendChild() Method Syntax:
Element appendChild() Method Parameter
The method takes one argument and that is a reference to the element we want to add as the last child (direct child) of an element.
Element appendChild() Method Return Value
The method returns a reference to the node element that we’ve just set as the argument of the method.
Example: document body appendChild
Note that here we’ve appended a text-node to the <p> element and then appended this element to the <body> of the document.