peterberkenbosch/gist:7565693

## gistfile1.html
<!DOCTYPE html>
<html lang="en">
  <head>
      <!--<meta charset="utf-8">
      <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">-->
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">

      <title><%= content_for?(:title) ? yield(:title) : "Test site" %></title>
      <%= csrf_meta_tags %>
      <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

      <script type= text/javascript>
        $(document).ready(function() {
          $.getJSON( "/api/products.json", function( data ) {
            var items = [];
            $.each( data["products"], function( key, val ) {
              items.push( "<li id='" + key + "'>" + val["name"] + "</li>" );
            });

            $( "<ul/>", {
              "class": "my-new-list",
              html: items.join( "" )
            }).appendTo( "body" );
          });
        });
      </script>
  </head>

  <body class="home">
      <script>

      </script>
  </body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<!--<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">-->
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title><%= content_for?(:title) ? yield(:title) : "Test site" %></title>
	<%= csrf_meta_tags %>
	<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

	<script type= text/javascript>
	$(document).ready(function() {
	$.getJSON( "/api/products.json", function( data ) {
	var items = [];
	$.each( data["products"], function( key, val ) {
	items.push( "<li id='" + key + "'>" + val["name"] + "</li>" );
	});

	$( "<ul/>", {
	"class": "my-new-list",
	html: items.join( "" )
	}).appendTo( "body" );
	});
	});
	</script>
	</head>

	<body class="home">
	<script>

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