How I Remove all Div contents but not the div using jquery?

Question

How I Remove all Div contents but not the div using jquery?

the div contains many ULs, LIs, DIVs, H1s

<div id="container">
  <ul>
      <li>test</li>
      <li>test</li>
  </ul>
  <div><h1>test</h1></div>
  <div><h1>test</h1></div>
  <div><h1>test</h1></div>
</div>

I would like to remove all the contents of container.

Thanks

Answer 1

$("#container").empty();

http://api.jquery.com/empty/

empty has an advantage over setting the element's html to nothing. From the documentation:

To avoid memory leaks, jQuery removes other constructs such as data and event handlers from the child elements before removing the elements themselves.

Answer 2

$('#container').html('');