jpetto/dom_demo_1.html

## dom_demo_1.html
<!DOCTYPE html>
<html>
<head>
	<title>DOM Demo</title>
</head>
<body>
	<form id="form1">
		<input type="text" id="user_name" value="" />
		<button type="submit" id="submit">Get It</button>
	</form>
	<ul id="names"></ul>
	<script>
		document.querySelector("#user_name").focus();

		var names = document.querySelector("#names");

		document.querySelector("#form1").onsubmit = function(e) {
			e.preventDefault();

			var user_name = document.querySelector("#user_name").value;

			var li, text;

			li = document.createElement("li");

			text = document.createTextNode(user_name);

			li.appendChild(text);

			names.appendChild(li);

			document.querySelector("#user_name").value = '';
		}
	</script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>DOM Demo</title>
	</head>
	<body>
	<form id="form1">
	<input type="text" id="user_name" value="" />
	<button type="submit" id="submit">Get It</button>
	</form>
	<ul id="names"></ul>
	<script>
	document.querySelector("#user_name").focus();

	var names = document.querySelector("#names");

	document.querySelector("#form1").onsubmit = function(e) {
	e.preventDefault();

	var user_name = document.querySelector("#user_name").value;

	var li, text;

	li = document.createElement("li");

	text = document.createTextNode(user_name);

	li.appendChild(text);

	names.appendChild(li);

	document.querySelector("#user_name").value = '';
	}
	</script>
	</body>
	</html>