[JQUERY] HTML 하위태그 삭제 및 태그 삭제

<div id = "div1">
    <div id = "div2">
        <div id = "div3">
         </div>
    <div>
</div>
<button id = "btn1"></button>
<button id = "btn2"></button>
 
<script>
// div1 하위태그 삭제
$("#btn1").click(function({
    $("#div1").empty();
});
 
// div1 태그 삭제
$("#btn2").click(function({
    $("#div1").remove();
});
 
</script>

첫번째 버튼 클릭시 div1 아래 div2, div3가 삭제되고

두번째 버튼 클릭시 div1, div2, div3 전체가 다 삭제됩니다.

차이점은 empty와 remove의 차이입니다.