jQuery tabsshow: ui.panel is DOM instead jQuery-object after first run

Question

I want to get the height of the currently selected tab and pass the value with postMessage() to it's parent iframe:

    // ...
    jQuery("#my-tabs").tabs({
        selected: ran,
        show: function( event, ui ) {
            try
            {
                console.log(ui.panel);

                var height = ui.panel.height();

                if (window.postMessage && parentUrl != undefined)
                    parent.postMessage("height:" + height, parentUrl);
            }
            catch (c)
            {
                console.log(c.message);
            }
        }

    });

works fine when the page is loaded and the randomly selected tab is shown.

But when selecting another tab, ui.panel isn't a jQuery object anymore, so accessing height() crashes: Object #<HTMLDivElement> has no method 'height'

I'am using jQuery 1.4.3 with UI 1.8.6 - but can't find anything about this strange behavior. (Tried also jQuery('#example').bind('tabsshow' ... same thing)

Answer 1

I have fixed it with checking for the height() method and otherwise parse the ui.panel to a jQuery object:

                if (typeof(ui.panel.height) == "function") {
                    var height = ui.panel.height();
                }
                else {
                    var panel = jQuery(ui.panel);
                    var height = panel.height();
                }