title: Displaying the results of a Javascript function
body: <p>I'm trying to get a javascript function to print out, but nothing comes up. Essentially I'm just setting up a basic page of text boxes, radio buttons and checkboxes for users to fill out and the results of those elements will print out to create a basic barebones profile page.</p>
  
  <p>I apologize in advance for any sloppy or obsolete coding, I'm starting out with this stuff (my first semester of classes in web design). I'm assuming I've made a minor error that I'm not catching that's screwing up with the rest of the code, or I'm just plain missing a key line of code.</p>
  
  <p>Here's the code below (Javascript):
  `</p>
  
  <pre><code>function validate()
  {
      dataOut = document.getElementById("profileOut");
  
      var color = document.profileIn.bgcolor.value;
      style.backgroundColor = color;
  
      var border = document.profileIn.border.value;
      style.border = border;
  
      var name = document.profileIn.name.value;
      dataOut.innerHTML = "&lt;h1 id='name'&gt;" name "&lt;/p&gt;";
  
      if  (document.GetElementById('sportsgames').checked {
          dataOut.innerHTML = "&lt;img src='images/sportsgames.jpg' alt='I like sports and games' /&gt;";
      } else if  (document.GetElementById('tvfilm').checked {
          dataOut.innerHTML = "&lt;img src='images/tvfilm.jpg' alt='I like tv and film' /&gt;";
      } else if  (document.GetElementById('artlit').checked {
          dataOut.innerHTML = "&lt;img src='images/artlit.jpg' alt='I like art and literature' /&gt;";
      } else {
          dataOut.innerHTML = "&lt;img src='images/nothing.jpg' alt='I hate everything' /&gt;";
      }
  
      var entry1 = document.profileIn.entry1.value;
      dataOut.innerHTML = "&lt;p id='para1'&gt;" entry1 "&lt;/p&gt;";
      document.getElementById("para1").style.color="#0000FF";
      var entry2 = document.profileIn.entry2.value;
      dataOut.innerHTML = "&lt;p id='para2'&gt;" entry2 "&lt;/p&gt;";
      document.getElementById("para2").style.color="#FF0000";
  
      var years = document.profileIn.years.value;
      dataOut.innerHTML = "&lt;p&gt;I have been practicing this hobby for " + years + " years.&lt;/p&gt;";
  
      var music = document.profileIn.music.value;
      dataOut.innerHTML = "&lt;p&gt; My favorite music genre is " + music + ".&lt;/p&gt;";
  
      var birthday = document.profileIn.birthday.value;
      dataOut.innerHTML = "&lt;p&gt;Birthday:" + music + "&lt;/p&gt;";
  
      var email = document.profileIn.email.value;
      dataOut.innerHTML = "&lt;p&gt; E-Mail:" + music + "&lt;/p&gt;";
  
      var website = document.profileIn.website.value;
      dataOut.innerHTML = "&lt;p&gt;Website:" + music + "&lt;/p&gt;";
  
      document.getElementById('profileOut').innerHTML = profileOut;
  }
  
  &lt;/script&gt;`
  </code></pre>
  
  <p>And the HTML code as well:</p>
  
  <pre><code>&lt;body id="profile"&gt;
  &lt;form id="profileIn" name="profileIn" method="post" onSubmit="return validate()"&gt;
      &lt;fieldset id ="set1"&gt;
          &lt;legend&gt;Your Page&lt;/legend&gt;
          &lt;label for="bgcolor"&gt;
          &lt;input type="color" id="bgcolor" name="bgcolor" value="#FFFFFF" /&gt; Select a background color&lt;br&gt;
  
          Choose the thickness of the border&lt;br&gt;
          &lt;input type="range" id="border" name="border" value="5" min="0" max="10" step="1" /&gt;&lt;br&gt;
          0 1 2 3 4 5 6 7 8 9 10
      &lt;/fieldset&gt;
  
      &lt;fieldset id="set2"&gt;
          &lt;legend&gt;Your Profile&lt;/legend&gt;
          Enter your name &lt;input type="text" id="name" name="name" /&gt; &lt;br&gt;
  
          Enter your favourite hobby &lt;br&gt;
          &lt;input type="radio" id="sportsgames" name="hobby" value="sportsgames"&gt;Sports &amp; Games&lt;br&gt;
          &lt;input type="radio" id="tvfilm" name="hobby" value="tvfilm"&gt;TV &amp; Film&lt;br&gt;
          &lt;input type="radio" id="artlit" name="hobby" value="artlit"&gt;Art &amp; Literature&lt;br&gt;&lt;br&gt;
  
          &lt;label for="entry"&gt;What part of that hobby is your favourite?&lt;/label&gt;&lt;br&gt;
          &lt;textarea id="entry1" name="comments1" rows="8" cols="50"&gt;Type in here...&lt;/textarea&gt;&lt;br&gt;    
  
          &lt;label for="entry"&gt;Which part of that hobby are you best at?&lt;/label&gt;&lt;br&gt;
          &lt;textarea id="entry2" name="comments2" rows="8" cols="50"&gt;Type in here...&lt;/textarea&gt;&lt;br&gt;
  
          How many years have you practiced this hobby? &lt;br&gt;
          &lt;input id="years" type="number" name="years" value="0" min="1" max="100" /&gt;&lt;br&gt;
  
          What's your favorite genre of music? &lt;br&gt;
          &lt;select id="music"&gt;
          &lt;option value="Rock"&gt;Rock&lt;option&gt;
          &lt;option value="Pop"&gt;Pop&lt;option&gt;
          &lt;option value="Country"&gt;Country&lt;option&gt;
          &lt;option value="R&amp;B"&gt;R&amp;amp;B&lt;option&gt;
          &lt;option value="Classical"&gt;Classical&lt;option&gt;
          &lt;/select&gt;
      &lt;/fieldset&gt;
  
      &lt;fieldset id="set3"&gt;
          &lt;legend&gt;Your Info&lt;/legend&gt;
          Birthday &lt;input id="birthday" type="date" name="date" /&gt; &lt;br&gt;
          Email &lt;input id="email" name="email" type="email" placeholder="example@gmail.com" /&gt; &lt;br&gt;
          Website &lt;input id="website" name="website" type="url" placeholder="www.example.com" /&gt;
      &lt;/fieldset&gt;
  
      &lt;fieldset id="set4"&gt;
          &lt;input class="btn" type="submit" id="btn1" value="Press to Continue" /&gt;
          &lt;input class="btn" type="reset" id="btn2" value="Press to Clear" /&gt;
      &lt;/fieldset&gt;
  &lt;/form&gt;
  
  &lt;section id="profileOut"&gt; &lt;/section&gt;
  </code></pre>
  
  <p>Any help's much appreciated, thanks guys!</p>