Need to remove a JQueryUI tab before adding another JQueryUI tab

I have a jquer开发者_开发知识库y ui problem which is as follows:

$("a[rel=#edit]").live("click", function(e) {
    var $tabs = $('#tabs').tabs();
    var selected = $tabs.tabs('option', 'selected');//gives the currently selected tab
    var tablength   = $tabs.tabs('length');//gives the tab length

    alert('tab length : '+tablength);
    // need to remove any edit page tabs if open as only one edit page need to be open. 

    $("#tabs").tabs("add",$(this).attr('href'),"Edit");

    return false;
});

What this code does is it add a new tab to the current set of tabs, when I click a edit link. The new page is an edit page with title Edit.

I want it to be that whenever I click on edit , if there is any opened edit page from my earlier clicks on the edit link, it sould be closed.

Now, I have been trying to get individual tab properties to check if the title is Edit , but haven't been able to do so. Any help on how to remove the existing edit page tabs would be greatly helpful.

You can try this selector

$("#tabs ul li:contains('Edit')").remove();

I.e. remove the list item with title "Edit" in the "tabs" div.

If you need to remove a tab and know the index of the tab, all you have to do is..

$("#tabs").tabs( "remove" , index);