is there a best way of "clearing" html inside an element using jQuery? I use .html(null) but is .html("") more efficient. And is there an even better/nicer way of achieving this?

is there a best way of "clearing" html inside an element using jQuery? I use .html(null) but is .html("") more efficient. And is there an even better/nicer way of achieving this?

• javascript
• jquery
• performance

Share Improve this question Follow asked May 28, 2012 at 15:53 RuslanRuslan 10.2k1515 gold badges5757 silver badges9292 bronze badges 1

• possible duplicate of How to remove an element's content with JQuery? – Shawn Chin Commented May 28, 2012 at 16:00

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 10

Is there a reason for not just using .empty()?

And, incidentally, if your question is about 'efficiency,' so long as efficiency is broadly parable with speed, then might I suggest JS Perf for self-testing?

Incidentally, in a JS Perf parison, with Chromium 18/Ubuntu 11.04, .empty() seems to be consistently the faster approach. References:

Further to the above; if you don't mind using plain ol' native JavaScript, it's even faster (on my Samsung II the DOM runs at ~82k ops/sec, on my desktop (nothing special) in Chromium 18/Ubuntu 11.04, the DOM runs at: ~860k ops/sec, as opposed to .empty() (the next fastest) at 8.4k ops/sec).

A DOM-based approach:

var list = document.getElementsByTagName('ul')[0];
while (list.firstChild) {
  list.removeChild(list.firstChild);
}

JS Perf parison of all above approaches.

References:

• empty().

http://api.jquery./empty/

provided by jQuery