更改Bootstrap JS选项卡

Question

我有以下脚本：

$(".btn.btn-default").click(function () {
$(this).siblings().removeClass('active').end().addClass('active').val($(this).text());
        if (this.id.contains('fear')) {
            $('#fear').val($(this).text());              
        } else if (this.id.contains('control')) {
            $('#control').val($(this).text());               
        } else if (this.id.contains('danger')) {
            $('#danger').val($(this).text());
            $('#tab2').tab('show');
        }
    });    

专注于点击#danger时，我正在尝试更改引导标签：

$('#tab2').tab('show');

然而它似乎不起作用。有什么想法吗？

//使用tab html

更新

<ul class="nav nav-tabs">
    <li class="active"><a data-toggle="tab" href="#tab1">Step 1</a></li>
    <li><a data-toggle="tab" href="#tab2">Step 2</a></li>            
</ul>

<div class="tab-content">
    <div id="tab1" class="tab-pane fade in active">
        <div id="obj" class="draggable drag-drop"> Grass </div>
        <div id="obj" class="draggable drag-drop"> Tree </div>                    
    </div>
    <div id="tab2" class="tab-pane fade in active">
        <div id="act" class="draggable drag-drop"> Fire </div>
        <div id="act" class="draggable drag-drop"> Collapsed </div>    
    </div>