Uncompressed Function

The uncompressed code.

function $x(parent,tree){
	if(typeof(parent)=='string')
		parent = document.createElement(parent)
	for(var i in tree){
		(typeof(tree[i])=='object')
			?$x(parent.appendChild(document.createElement(prev)), tree[i])
		:(prev=='text')
			?parent.appendChild(document.createTextNode(tree[i]))
		:(prev=='style')
			?parent.style.cssText=tree[i]
		:parent[prev] = tree[i]
		var prev = tree[i]
	}
	return parent;
}

Example Builder

Here is the code that actually built the stuff you see above. Sorry about the text going all out of the box. What can I say, it's out of control because it is so awesome.

/* Start Building Content Node */
var contentNode = $x('div',[
	'h3',[
		'text','Second Smallest?'
	],
	'p',[
		'text','Here is another version of a very small DOM builder using associative arrays instead of pure objects. \
		You can find a slightly smaller version of this that accomplishes the same thing here: The World\'s ',
		'a',[
			'style', 'color:#009',
			'text','Smallest JavaScript DOM Builder',
			'href', 'dom_builder.php'
		],
		'text',' here.'
	],
	'h3',[
		'text','The Compressed Code'
	],
	'p',[
		'text','Here it is, all compressed-like.'
	],
	'pre',[
		'text',"function $x(p,t){p=typeof(p)=='string'?document.createElement(p):p;"
			+"\nfor(var i in t){(typeof(t[i])=='object')?$x(p.appendChild(document.createElement(l)),t[i])"
			+"\n:(l=='text')?p.appendChild(document.createTextNode(t[i]))"
			+"\n:(l=='style')?p.style.cssText=t[i]:p[l]=t[i];var l=t[i]}return p;}"
	],
	'h3',[
		'text','Using the Builder ($x) Function:'
	],
	'p',[
		'text','Note that "x" is for "XML", the dollar-sign is just a ',
		'a',[
			'text', 'prototype',
			'href', 'http://prototype.conio.net/'
		],
		'text','-style special function prefix.',
		'br',[
		],
		'br',[
		],
		'text','Look at the example below and you will see how to use this. Basically, the DOM\
			tree is represented as an associative array. Strings are translated directly to\
			Element properties, while Arrays are interpreted as the elements\
			themselves. Special cases are the "text" and "style" properties. To set a CSS class, just use "className".'
	],
	'h3',[
		'text','Browser Testing'
	],
	'p',[
		'text','This function has been tested in IE6, IE 5.5, FireFox 1.0, FireFox 1.5, Netscape 7, and Opera 7 - I have no \
			idea if it works in other browsers, but that will cover 98% of your audience. The only element that is quirky \
			is the "style" (actually the style.cssText) property. For this to work with Opera 7 you will just have to stick with the className property and \
			use classes for all of your styles, which you should probably do anyway.'
	]
]);
/* End Building Content Node */

document.getElementById('divStrato').appendChild(contentNode);
The stuff below is an example of some possible craziness you can accomplish with this DOM builder. 
<script type="text/javascript">
function regLink(linkTarget){
	return ['a',['href',linkTarget,'text',linkTarget]];
}
function crazyLink(linkTarget){
	return ['a',[
		'href',linkTarget,
		'text',linkTarget,
		'style','font-weight:bold; font-size:'+(Math.random()*30+8)+'px; color:red;']
	];
}

var myTable = [
	'style','width:500px',
	'tbody',[
		'tr',[
			'td',[
				'text','1'
			],
			'td',[
				'text','2'
			],
			'td',[
				'text','3'
			]
		],
		'tr',[
			'td',[
				'text','4'
			],
			'td',[
				'text','5'
			],
			'td',crazyLink('http://www.google.com/')
		]
	]
]

var myDivHTML = $x('div',[
	'span',[
		'onmouseover', function(){this.style.cursor = 'pointer'},
		'onclick', function(){alert(this)},
		'b', [
			'onclick', function(){alert(this)},
			'id', 'replaceMe',
			'text', 'Click Here'
		],
		'style', 'color:red;'
	],
	'div',[
		'style','border:1px #000 solid',
		'onclick', function(){alert(this)},
		'text','hey',
		'span',[
			'onclick', function(){alert(this)},
			'text', 'This is a span inside a div'
		],
		'a',[
			'onclick', function(){return false},
			'href','http://www.google.com/',
			'text','Google'
		],
		'div',regLink('http://www.google.com/'),
		'span',regLink('http://www.yahoo.com/'),
		'p',crazyLink('http://www.test.com/'),
		'p',crazyLink('http://www.test.com/')
	],
	'div',[
		'text','Here is another div and I didn\'t have to use the ghetto underscore...'
	],
	'div',[
		'style','font-weight:bold;',
		'text','another table',
		'table',myTable
	]
])

document.getElementById('myDiv').appendChild(myDivHTML);
</script>