title: Change href tag based on button press
body: <p><strong>EDIT: The buttons in the corner will not be submitting the search. The go button would still be clicked to submit it.</strong></p>
  
  <p>So, I'm working on a little project when I'm bored at work. It isn't meant to be anything serious and I'm teaching a bit of javascript, jquery, html and css as I go (Thanks to you fine folks of course). This part I can't figure out, or find anything about.</p>
  
  <p>My page is: <a href="http://afrohorse.netau.net/" rel="nofollow">http://afrohorse.netau.net/</a></p>
  
  <p>As of right now, I have a form that when you type in, and press go, it will search google. I plan on having it so I can click one of four buttons (located on each corner of the page) and it will change where it searches when you submit. Here is the code for my form.</p>
  
  <pre><code>&lt;form onsubmit="location.href='https://www.google.ca/#q=' + document.getElementById('myInput').value; return false;"&gt;
     &lt;input type="text" id="myInput" class="search left" value="" autofocus/&gt;
     &lt;button class="go"&gt;&lt;span&gt;GO!&lt;/span&gt;&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>So, Ideally, I would like to have it so "<a href="https://www.google.ca/#q=" rel="nofollow">https://www.google.ca/#q=</a>" would change to "<a href="http://www.youtube.com/results?search_query=" rel="nofollow">http://www.youtube.com/results?search_query=</a>" after clicking the youtube button. Is this doable? If so how would be the easiest way?</p>
  
  <p>Thanks. :)</p>