The **`appendChild()` method** appends a node as the last child of a node.

# Syntax
```
node.appendChild(node)
```


<!DOCTYPE html>
<html>
<body>

<p> List down the states of matter. </p>
<ul id="states">
  <li>Solid</li>
  <li>Liquid</li>
</ul>

<p> So we missed one. which one is it? </p>

<p>Click the button to append an item (which is the missing state of matter) to the end of the list.</p>

<button onclick="myfunc()">Click Me</button>

<script>
function myfunc() {
  var node = document.createElement("LI");
  var n = document.createTextNode("Gas");
  node.appendChild(n);
  document.getElementById("states").appendChild(node);
}
</script>


</body>
</html>

codemirror

What is the appendchild method?

Appends a node as the last child of another node using node.appendChild(node) syntax.