hide and show html using javascript code example

Example: 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>

Tags:

Html Example

Recent Posts