<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="http://ajax.googleapis.com/ajax/lib…
</script>
<script type="text/javascript">
$(document).ready(function () {
$("button").click(function () {
$("p").css("background-color", "yellow");
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<h2>This is a heading</h2>
<p style="background-color:#ff0000">This is a paragraph.</p>
<p style="background-color:#00ff00">This is a paragraph.</p>
<p style="background-color:#0000ff">This is a paragraph.</p>
<button>Return background-color of p</button>
</form>
</body>
</html>
** I wrote this code to change color of <p> elements to yellow by jQuery. This code runs fine when I remove the form tag. But with form tag(this code) <p> element change color to yellow and instantly change back to the previous color. What's the reason for that.?