nothing but script tags

gistfile1.html

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
	$(function(){
		$("<title>").text("JAVASCRIPT PARTY").appendTo($("head"));

		$("<div>").addClass("container").css({
			"margin": "25px", 
			"width": "500px", 
			"border": "1px black solid", 
			"padding": "15px",
			"border-radius": "25px"
		}).appendTo($("body"));

		$("<h1>").text("JAVASCRIPT IS AWESOME").css({
			"color": "red", 
			"text-decoration": "underline"
		}).appendTo($(".container"));

		$("<ol>").addClass("awesomeList").appendTo($(".container"));

		$("<li>").text("this is a list").appendTo($(".awesomeList"));
		$("<li>").text("i made it with javascript").appendTo($(".awesomeList"));
		$("<li>").text("cuz html is whack").appendTo($(".awesomeList"));

		$("<p>").text("THE VERDICT IS IN: HTML IS OUT.").css({
			"color": "red", 
			"text-align": "center",
			"font-size": "25px"
		}).appendTo($(".container"));
		$("<hr>").appendTo($(".container"));
		$("<p>").text("build your entire single page web application inside a script tag inside of index.html").appendTo($(".container"));
	})
</script>

gistfile2.txt

ok so like the idea is that i think the browser just adds html and head and body for you automagically 
so why not just put <script></script> on the page and fill it with javascripts 
cuz you can use jquery to construct the html dom elements 
and add custom direct styling 
and you can even write helper functions that write html for you.