In jquery-ui 1.9, how do you create new tabs dynamically?

Question

According to the upgrade guide for jquery-ui 1.9 tabs - http://jqueryui.com/upgrade-guide/1.9/#deprecated-add-and-remove-methods-and-events-use-refresh-method - when adding

Answer 1

So, the right way to do this like a top answer but without nub_tabs.

$("div#tabs").tabs();
var tab_id = 1;
$("button#add-tab").click(function() {
    tab_id++; //It can be any id;

    $("div#tabs ul").append(
    '
#"+tab_id+"
');
$("div#tabs").append(
    '
#'+tab_id+'
');
    $("div#tabs").tabs("refresh");
});

//Now i want to show some functions from my code;
//It will not work for you, just want show the idea;

//No clone tabs

function if_tab_exist(thisI) { //thisI - contains some id, title and text for tab content.
    var tab_id = $(thisI).attr('id');
    if(!$('.ui-tabs-nav li#'+tab_id).is('*')) {
        addTab(thisI); //Add tab function
    } else {
        var TAB_index = $('.ui-tabs-nav li#'+tab_id).index();
        $("#tabs").tabs({active: TAB_index}); //Will activate already exist tab
    }
}

//Close tab
function close_tab(tab_id) {
    $('.ui-tabs-nav i[target='+tab_id+']').parent().remove();       
    $('#tabs div#'+tab_id+']').remove();
    $("#tabs").tabs("refresh");
}
//Events
//CLose
$("body").on('click','.ui-tabs-nav .ui-state-default i', function() {
    close_tab($(this).attr('target'));
});
//Add
$("body").on('click','.addTab', function() {
    if_tab_exist(this);
});