Show/hide ‘div’ using JavaScript

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.

This is my current 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;
}
<html>
<button onClick="replaceContentInContainer('target', 'replace_target')">View Portfolio</button>
<button onClick="replaceContentInOtherContainer('replace_target', 'target')">View Results</button>

<div>
  <span id="target">div1</span>
</div>

<div style="display:none">
  <span id="replace_target">div2</span>
</div>

The second function that replaces div2 is not working, but the first one is.

15 Answers
15

Leave a Comment