title: show/hide in javascript
body: <p>Hello everyone
  I will be explaining what i need to do and what i have so far.Ok this is what I have to do...
  Show code that has a div width of 300px and a background color of yellow. Do not display the div by default. Create a show link (a href). Using onclick event handler, show the div area. and this is what I have...</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" &gt; 
  &lt;html xmlns = "http://www.w3.org/1999/xhtml"xml: lang = "en"lang = "en" &gt; 
  &lt;head&gt;
  &lt;meta http - equiv = "content-type"content = "text/html; charset=utf-8" / &gt;
  &lt;link rel="stylesheet: href="finalpart3.css" type="text/css" /&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Final part 3&lt;/title&gt;
  &lt;script language="JavaScript"&gt;
  function setVisibility(id, visibility) {
  document.getElementById(id).style.display = visibility;
   }
  &lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body &gt;
  &lt;div id="sub3"&gt;&lt;a href="finalpart3.css"&gt;&lt;input type="button" name="type" value='Show Layer' onclick="setVisibility('sub3', 'inline');";&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>and here is my css file..</p>
  
  <pre><code>div {
  position: absolute;
  left: 100px;
  top: 200px;
  background-color: #FFDD00;
  width: 300px;
  padding: 10px;
  color: black;
  display: none;
   }
  </code></pre>
  
  <p>I know my code is wrong somewhere when you click the link it gives the code but no background color or nothing.My brain is fried at this point in time and I know it is something that is small. Can someone might point out where i need an extra code or something so that way the back ground can show up thanks. Or maybe I am ready it wrong and dont need a background color of yellow and 300px in width.</p>