JQuery hide () function is used to hide element from page. By using hide () method we can hide matched element from page. In this article I am trying to hide <div> element from page on button click.
Code:
<head>
<script type="text/javascript" src="jquery.min.js"> </script>
<script type="text/javascript">
$(document).ready(function()
{
$("div button").click(function
{
$(this).parents("div").hide("medium");// when button is clicked hide function will hide that particular <div> element from page
});
});
</script>
</head>
<body>
<h3>
JQuery Hide part of text example 1</h3>
<div>
jQuery is a library that makes it quicker and easier<br />
to build JavaScript webpages and web apps.<br />
<br />
<button> <!--button is define in div tag-->
Click to hide</button>
</div>
<h3>
JQuery Hide part of text example 2</h3>
<div>
JQuery hide method is use
<br />
to hide part of text from page<br /><br />
<button>
Click to hide</button>
</div>
</body>
</html>
When I will click on any particular button like I clicked on first button then text and button will hide but not heading as it is not in div tag as shown below:
Leave Comment