Question

There is a div #allContent that contains a few divs within it. I would like to return the entire #allContent as a string, but remove any divs contained inside that are not visible.

I imagine this can probably be accomplished with some combination of filter(), :visible, and contents(), but I can’t figure out exactly how to do it.

Answer 1

var clone = $('#allContent').clone()
                            .appendTo('body')
                            .find(':hidden')
                            .remove()
                            .end()
                            .remove();

var content = clone[0].outerHTML || $('<div>').append(clone).html();

Example: http://jsfiddle.net/ChXPB/3/

EDIT: Changed it to include the outerHTML div.

EDIT: Made it mostly chained, and repaired the Firefox shim.

---

Seems that we need to temporarily add the clone to the DOM.

This should do it:

$('#allContent').clone().find(':hidden').remove().end().html();