---
title: "unicorn/prefer-dom-node-append"
description: "Require `.append()` instead of `.appendChild()` on DOM nodes"
# Generated by src/codegen/lint-rule-docs.ts. Do not edit below this line.
plugin: "unicorn"
aliases: []
kind: "suggestion"
category: "pedantic"
default: "off"
fixable: "yes"
typeAware: false
deprecated: false
---

`appendChild()` takes exactly one node. `append()` takes any number of nodes, and strings too, so you don't need `document.createTextNode()` or one call per child.

The rule doesn't know types. It reports every call to a method named `appendChild` with one argument.

`--fix` renames the method.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"unicorn/prefer-dom-node-append" = "error" # or "warn"
```

{/* End of the generated section. */}

## Examples

Reported:

{/* bad */}
```js
const item = document.createElement("li");
list.appendChild(item);
```

Not reported:

{/* good */}
```js
const item = document.createElement("li");
list.append(item);
list.append("Total: ", count, footer);
```

## When not to use it

`appendChild()` returns the node it added and `append()` returns `undefined`. The rule doesn't check whether you use the result. `const item = list.appendChild(node)` is reported and fixed like any other call, and after the fix `item` is `undefined`. If your code relies on the returned node, leave the rule off, or review what `--fix` changed.