node package manager


Simple utility to create DOM nodes



Build Status Dependency Status

Selenium Test Status

DOM node creation ... now with added easy!

This module uses Node.js-style modules, for best results use browserify.


Create an empty <div> node and append it to the document body:

var create = require('chi-create');
var node = create('div');

Declare attributes on the node:

create('div', { "class": "test" });

Add text to the node (treats strings as text, not HTML):

create('div', 'Hello World');

Add existing DOM nodes (automatically detects DOM nodes):

var span = create('span', 'Hello World!');
create('div', span);

Add lots of nodes (can handle nested arrays and variadic arguments):

var children = [
    create('span', 'Hello '),
    create('span', 'World')
var mark = create('strong', '!');
create('div', children, mark);

Use them all together! Creates <div class="hello"><span>Hello</span> World<strong>!</strong></div>.

var hello = create('span', 'Hello'),
    mark = create('strong', '!'),
    attributes = { 'class': 'hello' };
create('span', attributes, hello, ' World', mark);


create(tagName, contents...);

tagName is the HTML tag name (e.g. 'div'). contents can be any number of arguments where each argument is either a plain object (for attributes), a string (for text), a DOM node (for adding existing DOM nodes), or an array that contains DOM nodes or more arrays.