articles

Home / DeveloperSection / Articles / JQuery hide part of text

JQuery hide part of text

Sachindra Singh9433 22-Feb-2011

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>

JQuery hide part of text

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:

JQuery hide part of text

JQuery hide part of text

 

 

 

 


Updated 07-Sep-2019

Leave Comment

Comments

Liked By