jQuery Plugin to Dynamically Create HTML DOM Elements - jQuery Element

File Size: 6.71KB
Views Total: 1668
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
jQuery Plugin to Dynamically Create HTML DOM Elements - jQuery Element

jQuery Element is a fancy jQuery plugin that allows you or your visitor to dynamically create HTML DOM elements without any server-side code. For example, with this plugin you can create a todo list on your web page for adding new todo items.

Basic Usage (Create a editable todo list):

1. Include jQuery library and jQuery Element on your web page

<script src="http://code.jquery.com/jquery.js" type="text/javascript"></script>
<script src="../jquery.element.js" type="text/javascript"></script>

2. The CSS

.todos {
padding: 10px;
position: absolute;
right: 5px;
background-color: yellow;
width: 400px;

3. The javascript

<script type="text/javascript">
$(function () {

// Handy abbreviation
var el = $.element;

// Showcase static

el.div({ className: 'control-group' },
  el.label({ className: 'control-label', htmlFor: 'inputEmail' },
  el.div({ className: 'controls' },
el.input({ type: 'text', id: 'inputEmail', placeholder: 'Email' })

var todosList, newTodoInput;

  'New todo:',
  newTodoInput = el.input({ type: 'text', placeholder:'What should we do?' }),
.click(function () {


This awesome jQuery plugin is developed by unknown. For more Advanced Usages, please check the demo page or visit the official website.