how to make a div disappear when another button i clicked code example

Example 1: how to make a div disappear when another button i clicked

<html>
<head>
<title></title>
<script>
function myFunction() { 
	document.getElementById("mainFrameOne").style.display="none"; 
	document.getElementById("mainFrameTwo").style.display="block"; 
}
</script>
</head>
<body>
<a id="mainFrameOne" onclick="myFunction()" href="#">
    mainFrameOne
</a>
<a id="mainFrameTwo" href="#" style="display:none;">
    mainFrameTwo
</a>
</body>
</html>

Example 2: how to make a div disappear when another button i clicked

<html>
<head>
<title></title>
<script>
function myFunction() { 
	document.getElementById("mainFrameOne").style.display="none"; 
	document.getElementById("mainFrameTwo").style.display="block"; 
}
</script>
</head>
<body>
<div id="mainFrameOne">
    <p>mainFrameOne</p>
</div>
<div id="mainFrameTwo" style="display:none;">
    <p>mainFrameTwo</p>
</div>
<button onclick="myFunction()">Click me</button>
</body>
</html>

Tags:

Css Example