Using jQuery to manipulate HTML
<p>I'm trying to create a javascript function that receives a string that is assumed to be HTML and removes all elements which would not be visible.  I'm not operating on the page here, just a string of HTML from anywhere.</p>

<p>At first it seemed using the :hidden selector would have been ideal, but I couldn't get that to work.  So I started playing with filter(), but haven't had success.</p>

<pre>
function StripInvisibleNodes(html) {
    var container = "" + html+ "";
    //var $onlyvisiblehtml = $(container).find(":hidden").remove(); // didn't work
    var $onlyvisiblehtml = $(container).find('*').filter(function() { return this.style.display == "none"; }).remove();
    var removed = $onlyvisiblehtml.html();
    return removed;
}
</pre>

<p>Update:  the following is the working solution</p>

<pre>
function StripInvisibleNodes(html) {
    $('body').append("&lt;div id='tempspace' style='visibility:hidden'>" + content + "&lt;/div>");
    var $toremove = $('#tempspace').find("*").filter(':hidden'); 
    $toremove.remove();
    var resultstring = $('#tempspace').html();
    $('#tempspace').remove();
    return resultstring;
}
</pre>
