How to add a close icon in bootstrap tabs?

Question

I want to add a close icon in bootstrap tabs and then I can close the tab by click the icon.

I try below but the \"X\" is displayed not on the same line as tab title.

Answer 1

the working fiddle is here

 function registerCloseEvent() {

$(".closeTab").click(function () {

    //there are multiple elements which has .closeTab icon so close the tab whose close icon is clicked
    var tabContentId = $(this).parent().attr("href");
    $(this).parent().parent().remove(); //remove li of tab
    $('#myTab a:last').tab('show'); // Select first tab
    $(tabContentId).remove(); //remove respective tab content

});
 }