title: Show/hide 'div' using JavaScript
body: <p>For a website I'm doing, I want to load one div, and hide another, then have two buttons that will toggle views between the div using JavaScript.</p>
  
  <p><strong>This is my current code</strong></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>function replaceContentInContainer(target, source) {
    document.getElementById(target).innerHTML = document.getElementById(source).innerHTML;
  }
  
  function replaceContentInOtherContainer(replace_target, source) {
    document.getElementById(replace_target).innerHTML = document.getElementById(source).innerHTML;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
  &lt;button onClick="replaceContentInContainer('target', 'replace_target')"&gt;View Portfolio&lt;/button&gt;
  &lt;button onClick="replaceContentInOtherContainer('replace_target', 'target')"&gt;View Results&lt;/button&gt;
  
  &lt;div&gt;
    &lt;span id="target"&gt;div1&lt;/span&gt;
  &lt;/div&gt;
  
  &lt;div style="display:none"&gt;
    &lt;span id="replace_target"&gt;div2&lt;/span&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>The second function that replaces div2 is not working, but the first one is.</p>