Home > DeveloperSection > Articles > JQuery hide part of text

JQuery hide part of text


JQuery JQuery 
Ratings:
0 Comment(s)
 4747  View(s)
Rate this:

hide method in JQuery

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>

hide()function in JQuery

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:

hide method in JQuery

hide method in JQuery

 

 

 

 


Don't want to miss updates? Please click the below button!

Follow MindStick