Why are use the empty method in JQuery?

Asked 28-Jul-2021
Viewed 156 times

1 Answer


1

The jQuery empty() method is used to remove content and child nodes from selected elements. This method does not remove by itself.
Syntax
 $(selector).empty()
<!DOCTYPE html>

<html>
<head>
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
    <script>
        $(document).ready(function () {
            $('.remove').click(function () {
                $('.main').empty(); // empty method
            });
            $('.add').click(function () {
                $('.main').text('Lorem ipsum dolor sit amet,'
                    + 'consectetur adipiscing elit, sed do eiusmod tempor'
                    + ' incididunt ut labore et dolore magna aliqua.'
                    +'Ut enim ad minim veniam,'
                    +'quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. ');
            });
        });
    </script>
    <style>
        body {
            padding:10px;
            margin:10px;
            box-sizing:border-box;
        }
         div{
            background-color:orange;
            color:white;
            width:50%;
            height:auto;
            font-size:35px;
            padding:10px;
            margin:10px;
            border:2px solid black;
        }
    </style>
</head>
<body>
    <button class='remove'>Empty Data form box</button>
    <button class='add'>add Data in box</button>
    <div class='main'>
    Lorem Ipsum is simply dummy text of the printing and typesetting industry.
        Lorem Ipsum has en the industry's standard dummy text ever since the 1500s,
         when an unknown printer took a galley of type and scrambled it to make a type
         specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.
    </div>
</body>
</html>
Output:
Why are use the empty method in JQuery?