Im trying to hide an element when the page opens and then show when a button is clicked
<p>Im trying to hide an element when the page opens and then show when a button is clicked but it doesnt show the element. i want the form with id extraForm to be hidden until button is pressed</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;head&gt;

&lt;script src="Javascripts/jquery.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript"&gt;
$(function () {
$("#extraForm").hide()
});
$('#showForm').click(function(){
$('#extraForm').show();
});
&lt;/script&gt;
&lt;link rel='stylesheet' href='website.css'&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;form action="submit.php" method="post"&gt;
&lt;table&gt; &lt;table border="1"&gt; &lt;tr&gt;
&lt;tr&gt; &lt;td&gt; First Name:     &lt;/td&gt; &lt;td&gt; &lt;input type="text" name="firstName"&gt;  &lt;/td&gt; &lt;/tr&gt; 
&lt;tr&gt; &lt;td&gt; Last Name:      &lt;/td&gt; &lt;td&gt; &lt;input type="text" name="lastName"&gt;   &lt;/td&gt; &lt;/tr&gt;
&lt;tr&gt; &lt;td&gt; Dorm Name:      &lt;/td&gt; &lt;td&gt; &lt;input type="text" name="dormName"&gt;   &lt;/td&gt; &lt;/tr&gt;
&lt;tr&gt; &lt;td&gt; Room Number:    &lt;/td&gt; &lt;td&gt; &lt;input type="text" name="roomNumber"&gt; &lt;/td&gt; &lt;/tr&gt;

&lt;tr&gt; &lt;td&gt; Pizza Type:     &lt;/td&gt; &lt;td&gt; &lt;input type="radio" name="pizzaType" value="Cheese"&gt;       
Cheese
&lt;input type="radio" name="pizzaType" value="Pepperoni"&gt; Pepperoni &lt;br&gt;
&lt;input type="radio" name="pizzaType" value="Buffalo Chicken"&gt; Buffalo Chicken &lt;/td&gt;
&lt;tr&gt; &lt;td&gt; Number of Pizza's:  &lt;td&gt;   &lt;input type="text" name="pizzaNumber"&gt; &lt;/td&gt; &lt;/tr&gt;
&lt;tr&gt; &lt;td&gt; &lt;/td&gt; &lt;td&gt;  &lt;input type="submit"&gt; &lt;/tr&gt; &lt;/td&gt;

&lt;table&gt; &lt;table border="1" id="extraForm"&gt;
&lt;tr&gt; &lt;td&gt; &lt;input type="radio" name="pizzaType" value="Cheese"&gt; Cheese&lt;/td&gt; &lt;/tr&gt;
&lt;tr&gt; &lt;td&gt; &lt;input type="radio" name="pizzaType" value="Buffalo Chicken"&gt; Buffalo Chicken      
&lt;/td&gt; &lt;/tr&gt;
&lt;tr&gt; &lt;td&gt; &lt;input type="radio" name="pizzaType" value="Pepperoni"&gt; Pepperoni&lt;/td&gt; &lt;/tr&gt;
&lt;input type="button" name="showForm" value="Add Pizza" id="showForm"&gt;
&lt;/table&gt;


&lt;/table&gt;

&lt;/form&gt;

&lt;/body&gt;
&lt;/html&gt;
</code></pre>
