JavascriptでCSVを読み取り表をつくる2

以下バグ。 要素ごどに操作できてない。

<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>tryjquery_hide_p test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
	 $("p#time").html("start");	
    <!-- $("div").append("<table>"); -->
    var k=1;
	<!-- $.get("summary.txt", function(data){ -->
	 $.get("summary2.txt", function(data){ 
		
	   $("p#time").html("reading -> split");		
	  html=data.split("\n");
     
	 	$("p#time").html("splited");
      <!-- $("div.file p").html(html[1]); -->
      for(var i in html){
      		k=k+1;
		
		    $("p#time").html(k+"<br>");
     		$("table.test tbody").append("<tr>");
      		 i2=html[i].split(",");
    		 		 
             
             for(var j in i2){
             	<!--	 alert(i); --> 
             	  $("table.test tbody").append("<td>");
                 $("table.test tbody").append(i2[j]);	
                $("table.test tbody").append("</td>");
             }
     	  $("table.test tbody").append("<tr>");        
             
       }
      
      	 <!-- $("table.test tbody").append("</table>");-->
      	  
    });
});
</script>

</head>
<body>
  <!-- <div class="file"> -->
  <p id="time"></p>
   <table class="test">
   <tbody>
   </tbody>
   </table>
  <!--	</div> -->
</body>
</html>


行に色をつける
http://www.18th-technote.com/paint-table-color
Jquery 逆ひきレファレンス
http://www.atmarkit.co.jp/ait/articles/1002/12/news101_9.html
DOMとは?
http://piyo-js.com/05/use-dom.html
様々なjequryプラグイン
http://blog.verygoodtown.com/2011/05/jquery-table-plugins/
要素操作
http://semooh.jp/jquery/api/manipulation/

Fexigrid
http://news.mynavi.jp/articles/2008/06/25/flexigrid/

かっこよく
http://d.hatena.ne.jp/sideroad/20090801/1249123105

sperk line
https://www.nothingbutsharepoint.com/sites/eusp/Pages/a-new-kind-of-sharepoint-chart-and-graph-solution.aspx

基本的には、かっこよくする場合はjqueryのバージョンの古いの考慮が必要
グラフ
http://tokkono.cute.coocan.jp/blog/slow/index.php/programming/javascript-data-visualization-libs/
これが正解。
DOM要素をつくる->その中を操作するって感覚が慣れないけど、面白いな。
:lastセレクタで ダグの最後にどんどん付け加えていくのポイント
:CSSで色つけもしてる.
:グワーっと一気にグループを操作するイメージ

<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>tryjquery_hide_p test</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- <script type="text/javascript" src="jquery.tablesorter.js"></script> -->
<script>
$(document).ready(function(){
	 $("p#time").html("start");	
    <!-- $("div").append("<table>"); -->
    var k=1;
	<!-- $.get("summary.txt", function(data){ -->
	  $.get("summary2.txt", function(data){ 
	<!-- $.get("data.csv", function(data){ --> 
		
	   $("p#time").html("reading -> split");		
	  html=data.split("\n");
     
	 	$("p#time").html("splited");
      <!-- $("div.file p").html(html[1]); -->
      for(var i in html){
      		k=k+1;
		
		    $("p#time").html(k+"<br>");
		    $("table.test tbody").append("<tr></tr>");
		    
     		
      		 i2=html[i].split(",");
    		 		 
             
             for(var j in i2){
             	<!--	 alert(i); --> 
             	  $("table.test tbody tr:last").append("<td></td>");
             	  $("table.test tbody tr td:last").append(i2[j]);
             	 
                <!--  $("table.test tbody").append(i2[j]); 
                $("table.test tbody").append("</td>"); -->
             }
     	  <!-- $("table.test tbody").append("</tr>");-->        
             
       }
       $("table.test").find("tr:odd").addClass("odd");
       $("table.test").find("tr:even").addClass("even");
      
      	 <!-- $("table.test tbody").append("</table>");-->
      	  
    
    });
    <!-- ("#myTable").tablesorter(); --> 
});
</script>

<style type="text/css">
	table#myTable {
	border: 1px solid #cccccc;
	border-collapse: collapse;
	background:#fffff;
	}
	table#myTable td {
	border: 1px solid #cccccc;
	<!-- padding:10px;-->
	}
	table#myTable tr.odd td {
	background-color: #ffffff;
	padding:10px;
	}
	table#myTable tr.even td {
	background-color: #F6F5F0;
	padding:10px;
	}
</style>


</head>
<body>
  <!-- <div class="file"> -->
  <p id="time"></p>
   <table id="myTable" class="test">
   <tbody>
   </tbody>
   </table>
  <!--	</div> -->
</body>
</html>