inner div invisible with jquery

Question

I'm using JQuery tabs to implement a very simple tabbed web site design. It works OK, unless I define another div inside every pane's div - this inner div is always invisible, i.e. display:none.

I can probably hack it to make it work, but maybe I'm missing something. Is it how JQuery supposed to work ?

<div class="panes">
<div>
This one works OK
</div>
<div>
This is OK as well
<div>
But this one is not shown
</div>
</div>
</div>

<script>

// perform JavaScript after the document is scriptable.
$(function() {
    // setup ul.tabs to work as tabs for each div directly under div.panes
    $("ul.tabs").tabs("div.panes > div");
});
</script>