Problem with dynamically adding a tab to nested tabs

Problem with dynamically adding a tab to nested tabs

I'm having difficulty in dynamically adding a tab to a nested set of tabs.

I have included 3 files to illustrate what I'm attempting:

outer.html : this is an outer set of tabs.  In the real system, the contents of the tabs are loaded asynchronously and are not known ahead of time.

inner.html : this is another page that has tabs in it.  Note that the contents of this would be dynamically generated, so the fact that it contains tabs (or does not contain them) isn't known when the real code is called.  Further, this set of tabs can be extended on the fly using the tabs('add', 'url', ...) method.

test.html : this is just a sample file that works as a placeholder for other simple, real data being returned.

Each time I add a new tab in inner.html, the nested set of tabs is completely replaced.  It looks like the selectors are somehow getting mingled together.  I see that both pages work independently, but the nesting causes an error.

I had to remove the .html extension from the file names to upload them here, fyi.

I'd appreciate any help - thanks!