<button id="btn1">remove()</button>
<button id="btn2">remove(".red")</button>
<button id="btn3">remove(".yellow,.green")</button>
    
<div id="box">
    <p>Lorem ipsum dolor sit amet.</p>
    <p>Lorem ipsum dolor sit amet.</p>
    <p>Lorem ipsum dolor sit amet.</p>
</div>    
    
<p class="red">Lorem ipsum dolor sit amet.</p>
<p class="yellow">Lorem ipsum dolor sit amet.</p>
<p class="green">Lorem ipsum dolor sit amet.</p>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

button {
    width: 200px;
    padding: 10px;
    margin-right: 8px;
    margin-bottom: 8px;
    background-color: tomato;
    color: #fff;
    border: none;
    cursor: pointer;
    font-size: 16px;
}

#box {
    border: 3px solid black;
    padding: 10px;
}

.red{
    background-color: red;
}

.yellow{
    background-color:yellow;
}

.green{
    background-color:green;
}

$(document).ready(function() {
    $("#btn1").click(function() {
        $("#box").remove();
    });

    $("#btn2").click(function() {
        $("p").remove(".red");
    });

    $("#btn3").click(function() {
        $("p").remove(".yellow,.green");
    });
});