jQuery를 사용하면 현재 사용되는 HTML 요소들을 쉽게 제거할 수 있습니다.

요소들과 콘텐츠를 제거하기 위한 두 가지의 주된 jQuery 메서드가 있습니다.

• remove() - 선택한 요소 (및 자식 요소)를 제거합니다.
• empty() - 선택한 요소에서 자식 요소를 제거합니다.

jQuery remove() 메소드는 선택된 요소와 그 자식 요소를 제거합니다.

    $(document).ready(function () {
      $("button").click(function () {
        $("#div1").remove();
      });
    });

jQuery empty() 메서드는 선택한 요소의 자식 요소를 제거합니다.

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

jQuery remove() 메서드는 또한 하나의 매개변수를 받아서, 제거할 요소를 필터링 할 수 있게 합니다.

매개 변수는 jQuery 셀렉터 구문 중 하나 일 수 있습니다.

다음 예제는 class="test"를 가진 모든 <p> 요소를 제거합니다:

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

다음 예제에서는 class="test"및 class="demo"가 있는 모든 <p> 요소를 제거합니다:

    $(document).ready(function () {
      $("button").click(function () {
        $("p").remove(".test, .demo");
      });
    });

모든 jQuery HTML 메서드에 대한 전체 개요를 보려면, jQuery HTML/CSS Reference로 이동하십시오.