hidekiy/jquery-elementize.html

## jquery-elementize.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jquery-elementize</title>
<style>
</style>
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.js"></script>
<script>

function elementize(node) {
  var html = node[0],
		props = node[1],
		children = (props && props.children) || [];

	if (props) {
		delete props.children;
	}

	var $el = $(html, props).append(children.map(function (item) {
		return elementize(item);
	}));

	return $el[0]
}

$('body').append(elementize(
	['<div/>', {children: [
		['<section/>', {children: [
			['<p/>', {text: 'foobar', click: function () { alert('foobar'); }}],
			['<hr/>'],
			['<p/>', {text: 'hogehoge', css: {color: 'blue'}}]
		]}]
	]}]
));

</script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>jquery-elementize</title>
	<style>
	</style>
	</head>
	<body>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.js"></script>
	<script>

	function elementize(node) {
	var html = node[0],
	props = node[1],
	children = (props && props.children) \|\| [];

	if (props) {
	delete props.children;
	}

	var $el = $(html, props).append(children.map(function (item) {
	return elementize(item);
	}));

	return $el[0]
	}

	$('body').append(elementize(
	['<div/>', {children: [
	['<section/>', {children: [
	['<p/>', {text: 'foobar', click: function () { alert('foobar'); }}],
	['<hr/>'],
	['<p/>', {text: 'hogehoge', css: {color: 'blue'}}]
	]}]
	]}]
	));

	</script>
	</body>
	</html>