How can I handle different json data for each of the jquery tabs?

I have three 3 (jquery) tabs:

• Overview
• Pricing
• Destination info

Each of these tabs have entirely different data. I can specify a URL in the href to make an AJAX call. However, how do I handle the data received for each of these tabs (so that I can render them depending on the context) ?

Should I use the load event to manipulate data ? If so, how can I get a handle on the returned json data in the load event ?

I have little experience with jQuery UI, but I know you can get data from an AJAX request as JSON (here):

$.ajax({
  url: "http://example.com/page.html",
  dataType: "json",
}).done(function ( data ) {
  // Do some stuff with the data
});

Or you could use jQuery.getJSON. Then there is always jQuery.parseJSON.

EDIT: As far as I can figure out, this is the best you're going to get:

$(window).load(function(){
    $(function() {
        $( "#tabs" ).tabs({
            ajaxOptions: {
                error: function( xhr, status, index, anchor ) {
                    $( anchor.hash ).html(
                        "Couldn't load this tab. We'll try to fix this as soon as possible. " +
                        "If this wouldn't be a demo." );
                },
                success: function( jsonObject, status ) {
                        // Code
                },
                dataType: "json"
            }
        });
    });
});

With this, the json would need to include the tab you were working with. This would make for a rather inelegant solution, as you will have to switch on the tab value returned from the json. It seems as though the tab API is not meant for anyone to handle the display process themselves. I see three other options: redo the tab API yourself; hack the API to do your thing; or do something like get_tab_contents.php?tabid=someid&json=somepath