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>