jQuery Tabs not working

Question

I don't know why this doesn't work, although it should:

$('#group-tabs').tabs({
    iframe: true,
    load: function(event, ui) {
        $('a', ui.panel).click(function() {
            $("#test").load(this.href);
            return false;
        });
    }
});

Slightly older versions (jquery 1.8.x and jquery-ui 1.9.x)

http://jsfiddle.net/QGZZT/1/

Answer 1

You needed to change your javascript, you were accessing the wrong elements:

$('#group-tabs').tabs({
    iframe: true,
    beforeLoad: function(event, ui) {
        $('a').click(function() {
            alert(this.href);
            $(".tab-content").load(this.href);
            return false;
        });
    }
});

Ref. http://jsfiddle.net/QGZZT/2/

However, I don't believe you are able to do what you want, because "Due to browser restrictions, most Ajax requests are subject to the "same origin policy"."

Ref. Cannot load an external page with jQuery.load into a div in my page

You can; however, try using $.get or simply changing the source of an iFrame (very easy).