jQuery select everything but a child div of children

Question

I have the following HTML content:

<div class="content">
    <div class="div-content">
        <div>
            <div class="div-botoes">
                <input id="bt1" type="button" tabindex="0" value="bt1">
                <input id="bt2" type="button" tabindex="0" value="bt2">
            </div>
            <ul class="divFormArea">
                <li id="li1">
                    <span><span>span</span></span>
                    <div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li id="li2">
                    <span><span>span</span></span>
                    <div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li id="li3">
                    <span><span>span</span></span>
                    <div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div> lorem ipsum </div>
                        </div>
                        <div>
                            <div> lorem ipsum </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                            <div>
                                <div> lorem ipsum </div>
                            </div>
                        </div>
                    </div>
                </li>
                <li id="li4">
                    <span><span>span</span></span>
                    <div>
                        <div id="dontWantThisDiv" class="dont-want-this-div">
                            <div>
                                <div>
                                    Elements
                                </div>
                            </div>
                            <div>
                                Elements
                            </div>
                        </div>
                        <script id="script">
                            ScriptContent
                        </script>
                    </div>
                </li>
            </ul>
            <span><span><span>a</span>c<span>b</span></span>d</span>
        </div>
    </div>
</div>

I want to use a jQuery 1.9.1 selector that brings me everything on this content except the div #dontWantThisDiv.

I've tried lots of selectors but no one seems to select what I want. Here's a Fiddle

Answer 1

If you want to get all the elements under .content except #dontWantThisDiv instead of the selector you can try this:-

var cloneHtml = $( ".content" ).clone().find('#dontWantThisDiv').remove();
console.log(cloneHtml.html())