<!doctype html>
<html>
  <head>
	<link rel="stylesheet" href="jquery.ui.all.css">
  </head>
  
  <body>
    <h2>To do</h2>
    <button id="deleteAll">Delete all selected</button>
    <div id="main"></div>
  </body>
  <script src="../../src/html.engine.js" type="text/javascript"></script>
  <script src="HTMLengine-performance-test.js" type="text/javascript"></script>
</html>
<!doctype html>
<html>
  <head>
	<link rel="stylesheet" href="jquery.ui.all.css" />
    <style type="text/css">
        .html-error {color: red;}
    </style>
  </head>
  
  <body>
    <h2>To do</h2>
    Number of children to add: 
    <br />
    <input type="text" id="numberOfChildren" value="100" />
    <button id="addChildren">Add children</button>
    <br />
    Render in <span id="timeCounter">0</span> milliseconds
    <br />
    <br />
    <button id="deleteAll">Delete all selected</button>
    
    <div id="main"></div>
  </body>
  <script src="../../src/html.engine.js" type="text/javascript"></script>
  <script src="HTMLengine-performance-test.js" type="text/javascript"></script>
</html>

Add validation, filter, refactor the example
Add validation, filter, refactor the example