编程练习题,each方法。求大神怎么下面的代码不正确呢
<html>
<head>
<title>挑战题</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<style>
ul {margin: 0; padding: 0;}
li { list-style: none;}
input.text { padding-left: 4px; outline: none;}
</style>
</head>
<body>
<form action="#" method="get">
<input id="text" class="text" type="text" name="UserName" placeholder="请输入姓名">
<input id="SaveButton" type="button" value="Save Data">
<input id="ShowButton" type="button" value="Show Data">
</form>
<ul></ul>
<script>
var $txt=$("#text");
var json=[];
$('#SaveButton').on('click',function () {
json.push({name: $txt.val()})
});
$("#ShowButton").on("click",function () {
$.each(json,function (index) {
$("ul").append("<li>"+json[index].name+"</li>")
})
})
</script>
</body>
</html>