hide div in javascript code example
Example 1: javascript hide div
// javascript
<script>
document.getElementById("id").style.display = "none"; //hide
document.getElementById("id").style.display = "block"; //show
document.getElementById("id").style.display = ""; //show
</script>
// html
<html>
<div id="id" style="display:none">
<div id="id" style="display:block">
</html>
// jquery
<script>
$("#id").hide();
$("#id").show();
</script>
Example 2: js hide div
//If you have jquery, you can use the following method:
$("#mydiv").hide(); //hides div.
$("#mydiv").show(); //shows div.
//If you don't have jquery...
//search up the following: html how to add jquery
Example 3: how to hide div in html
document.getElementById('elementName').hide();
Example 4: hide element js
function showStuff(id, text, btn) {
document.getElementById(id).style.display = 'block';
// hide the lorem ipsum text
document.getElementById(text).style.display = 'none';
// hide the link
btn.style.display = 'none';
}
Example 5: javascript hide show div
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("#hide").click(function(){
$("#1").hide();
$("#2").show();
});
$("#show").click(function(){
$("#1").show();
$("#2").hide();
});
});
</script>
</head>
<body>
<p id="1">Area 1</p>
<p id="2" style="display: none;">Second area</p>
<button id="show">Area 1</button>
<button id="hide">Second Area</button>
</body>
</html>
Example 6: javascript hide a div
<div id="main">
<p> Hide/show this div </p>
</div>
('#main').hide(); //to hide
// 2nd way, by injecting css using jquery
$("#main").css("display", "none");