1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 2 "http://www.w3.org/TR/html4/loose.dtd"> 3 <html> 4 <head> 5 <title></title> 6 <script type="text/javascript"> 7 var next = 0; 8 9 function addMore() { 10 var box = document.createElement('DIV'); 11 box.id = 'box' + next++; 12 box.className = 'redbox'; 13 box.style.width = '150px'; 14 box.style.height = '150px'; 15 box.style.backgroundColor = 'red'; 16 box.style.border = '1px solid black'; 17 box.style.margin = '5px'; 18 19 window.setTimeout(function() { 20 document.body.appendChild(box); 21 }, 1000); 22 } 23 24 function reveal() { 25 var elem = document.getElementById('revealed'); 26 window.setTimeout(function() { 27 elem.style.display = ''; 28 }, 1000); 29 } 30 </script> 31 </head> 32 <body> 33 <input id="adder" type="button" value="Add a box!" onclick="addMore()"/> 34 35 <input id="reveal" type="button" value="Reveal a new input" onclick="reveal();" /> 36 37 <input id="revealed" style="display:none;" /> 38 </body> 39 </html>