🔖 v1.0.1

README.md

@@ -3,52 +3,79 @@
 ![Node](https://img.shields.io/node/v/dom-create-element-query-selector.svg?style=flat-square)
 [![NPM](https://img.shields.io/npm/v/dom-create-element-query-selector.svg?style=flat-square)](https://www.npmjs.com/package/dom-create-element-query-selector)
 [![Travis](https://img.shields.io/travis/hekigan/dom-create-element-query-selector/master.svg?style=flat-square)](https://travis-ci.org/hekigan/dom-create-element-query-selector)
-[![David](https://img.shields.io/david/hekigan/dom-create-element-query-selector.svg?style=flat-square)](https://david-dm.org/hekigan/dom-create-element-query-selector)
-[![Coverage Status](https://img.shields.io/coveralls/hekigan/dom-create-element-query-selector.svg?style=flat-square)](https://coveralls.io/github/hekigan/dom-create-element-query-selector)
+[![Coverage Status](https://coveralls.io/repos/github/hekigan/dom-create-element-query-selector/badge.svg?branch=master)](https://coveralls.io/github/hekigan/dom-create-element-query-selector?branch=master)
 
 > A utility function to create DOM elements with CSS selector-like syntax
 
+### Description
+
+As I had to use vanilla Javascript for a project, I got upset with how verbose it was to create DOM elements.
+
+I use the same css-selector-like syntax as `document.querySelector()` to create the new Nodes in a more compact, simple and readable way.
+
+There are no dependencies and multiple versions are available (es5, es6, UMD). See the BUILD section below for more information. 
+
 ### Usage
 
+#### Basic
+
+The simplest example add an empty `div` tag to the document's `body`.
 ```js
 import createElement from 'dom-create-element-query-selector';
 
+const body = document.querySelector('body');
+body.appendChild(createElement());
 ```
 
-### Installation
+#### Other usages
+```js
+import createElement from 'dom-create-element-query-selector';
 
-Install via [yarn](https://github.com/yarnpkg/yarn)
+let elt = null;
 
-	yarn add dom-create-element-query-selector (--dev)
+// some examples
 
-or npm
+elt = createElement(); // <div></div>
 
-	npm install dom-create-element-query-selector (--save-dev)
+// create a span node with an id
+elt = createElement('span#my-id'); // <span id="my-id"></span>
 
+// add class
+elt = createElement('span.my-class'); // <span class="my-class"></span>
 
-### configuration
+// add id and class
+elt = createElement('span#my-id.my-class'); // <span id="my-id" class="my-class"></span>
 
-You can pass in extra options as a configuration object (➕ required, ➖ optional, ✏️ default).
+// add class and attributes
+elt = createElement('a[href=#].link'); // <a class="link" href="#"></a>
 
-```js
-import createElement from 'dom-create-element-query-selector';
+// add content to the new element (text & other nodes)
+elt = createElement('div',
+    'paragraphs',
+    createElement('p', 'paragraph 1'),
+    createElement('p', 'paragraph 2')
+);
+// <div>
+//  paragraphs
+//  <p>paragraph 1</p>
+//  <p>paragraph 2</p>
+// </div>
+
+// add the generated element to the DOM
+document.querySelector('body').appendChild(elt);
 
 ```
 
-➖ **property** ( type ) ` ✏️ default `
-<br/> 📝 description
-<br/> ❗️ warning
-<br/> ℹ️ info
-<br/> 💡 example
+### Installation
 
-### methods
+Install via [yarn](https://github.com/yarnpkg/yarn)
 
-#### #name
+	yarn add dom-create-element-query-selector (--dev)
 
-```js
-createElement
+or npm
+
+	npm install dom-create-element-query-selector (--save-dev)
 
-```
 
 ### Examples
 

example/script.js

@@ -1 +1,30 @@
+// get the script
 const createElement = require(`../`);
+
+let elt = null;
+
+// some examples
+
+elt = createElement(); // <div></div>
+
+elt = createElement('span#my-id'); // <span id="my-id"></span>
+
+elt = createElement('span.my-class'); // <span class="my-class"></span>
+
+elt = createElement('span#my-id.my-class'); // <span id="my-id" class="my-class"></span>
+
+elt = createElement('a[href=#].link'); // <a class="link" href="#"></a>
+
+elt = createElement('div',
+    'paragraphs',
+    createElement('p', 'paragraph 1'),
+    createElement('p', 'paragraph 2')
+);
+// <div>
+//  paragraphs
+//  <p>paragraph 1</p>
+//  <p>paragraph 2</p>
+// </div>
+
+// add the generated element to the DOM
+document.querySelector('body').appendChild(elt);

package.json

@@ -1,6 +1,6 @@
 {
   "name": "dom-create-element-query-selector",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "A utility function to create DOM elements with CSS selector-like syntax",
   "main": "cjs/index.js",
   "browser": "dist/domCreateElementQuerySelector.js",