If you want to remove all the child nodes which contain selected HTML elements then it's not a difficult task now, we can do this easily with the help of jQuery empty() method.

All the child nodes of our selected HTML element will be removed by jQuery empty() method when applied but it does not remove the selected element but it only removes all the child nodes of that element.

syntax:-

    selector.empty( );

selector − it is used to select HTML elements in which jquery has to be applied by using either id , class or HTML elements.

Below is html code for jquery empty() method example.

    <div id="remove_div" style="height:150px;width:350px;border:2px solid #000;background-color:grey;">
    <p>Lorem ipsum Lorem ipsum Lorem ipsum .</p>
    <p>Lorem ipsum Lorem ipsum Lorem ipsum .</p>
    <p>Lorem ipsum Lorem ipsum Lorem ipsum .</p>
    </div>
    <button>Remove</button>

Below is jquery remove method() code :-

    $(document).ready(function(){
        $("button").click(function(){
            $("#remove_div").empty();
        });
    });

In above example $("#remove_div").empty();  this jQuery empty method is not removing the whole div but it is removing all its child elements with the help of  id i.e remove_div which we give to the div.

working demo:-https://jsfiddle.net/9vhhoyws/