title: Update div content when link is clicked
body: <p>I'm trying to create a list of links that update the content in a div when clicked.</p>
  
  <p>Looking at the code below, I want the div with id <code>container</code> to be populated with the content of the relevant div when a link is clicked.</p>
  
  <pre><code>&lt;a class="glyphicon glyphicon-cutlery" onclick="fixScroll('food');"&gt;&lt;/a&gt;
  &lt;a class="glyphicon glyphicon-cutlery" onclick="fixScroll('water');"&gt;&lt;/a&gt;
  
  &lt;div id="food"  style="height:20px;"&gt;Clicking Food Link Shows this in Div&lt;/div&gt;
  &lt;div id="water"  style="height:20px;"&gt;Clicking Water Link Shows this in Div&lt;/div&gt;
  
  &lt;div id="container" style="width:100%; height:150px;"&gt;This Div box is Empty till you click one the links, then its Populated by the correct stuff&lt;/div&gt;
  </code></pre>
  
  <p>I hope this is enough information. I'm basically trying to make the content of hidden divs (<code>food</code> &amp; <code>water</code>) display in the <code>container</code> div when clicking a link.</p>