[jQuery] this.reset() doesn't work

[jQuery] this.reset() doesn't work


Hi,
I am trying to reset all the form element but it is not working can
someone suggest the reason.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1" />
<title>jQuery Starterkit</title>
<link rel="stylesheet" type="text/css" media="screen"
href="screen.css" />
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="custom.js" type="text/javascript"></script>
</head>
<body>
<SCRIPT LANGUAGE="JavaScript">
<!--
$(document).ready(function() {
$("#reset").click(function() {
$("form").each(function() {
this.reset();
});
});
});
//-->
</SCRIPT>
<h1>jQuery Starterkit</h1>
<h2>This page contains code to test the examples. Most of it is only
relevant for a example.</h2>
<a id="first" href="#">Some link</a>
<br/><br/><hr/>


<p style="visibility:display">Hehehehe so think you can hide me :-p </
p>



<br/><br/><hr/>
    <form id="form" name="form1">
        Form 1
        <input name="foo" value="XXX" />
    </form>
    <form id="form" name="form2">
        Form 2
        <input name="bar" value="YYY" />
    </form>
    <form id="form" name="form3">
        Form 3
        <input type="checkbox" />
        <input type="checkbox" checked="checked" />
    </form>
<br/><br/><hr/>
    <a id="reset" href="#">Reset!</a>
</body>
</html>