<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Dispose Bootstrap Tab Using jQuery</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"></script>
$(document).ready(function(){ $("#myTab a").each(function(index, element){ new bootstrap.Tab(element);
$("#myBtn").click(function(){ var lastTab = bootstrap.Tab.getInstance($("#myTab a:last")[0]); $("#myTab a:last").tab("dispose"); <ul class="nav nav-tabs" id="myTab">
<a href="#home" class="nav-link active" data-bs-toggle="tab">Home</a>
<a href="#profile" class="nav-link" data-bs-toggle="tab">Profile</a>
<a href="#messages" class="nav-link" data-bs-toggle="tab">Messages</a>
<div class="tab-content">
<div class="tab-pane fade show active" id="home">
