jQuery dialog load a tabbed from url not working

Question

I am working on opencart. I tried to create a modal dialog popup every time user click a link that contains a product page. That links has a tabs inside (review,description). It load successfully, but the tabs are not working. How can i fix this?

This is how i call this:

$('a[href*="index.php?route=product/product"]').click(function(event){
    event.preventDefault();
    showDialog(this.href);
});

$("#dialog-modal").dialog({  //create dialog, but keep it closed
   autoOpen: false,
   height: 550,
   width: 1000,
   position: "center",
   modal: true,
   close: function(event, ui) { $('#wrap').show(); },
   open: function(event, ui) { $('.ui-widget-overlay').bind('click', function(){ $("#dialog-modal").dialog('close'); }); }
});

function showDialog(urlToLoad){  //load content and open dialog
    $.ajax({
        type: "POST",
        url: urlToLoad,
        success: function( returnedData ) {
            var $html = $(returnedData);
            var content = $html.find('#content').find('.breadcrumb').remove();
            content = $html.find('#content').html();
            var container = document.getElementById('dialog-content');
            container.innerHTML = content;
            $("#dialog-modal").dialog("open");
            $('#tabs a').tabs();
      }
    });
}

Apparently the $('#tabs a').tabs(); after $("#dialog-modal").dialog("open"); is not working.

Answer 1

Finally i solve this. It's just a silly problem, i forgot to import the jquerytabs.js in my caller page. So the tabs() function doesn't work. Now it's work perfectly.