图标切换bootstrap 3和JQuery Validate - 无法正常运行

Question

我一直在研究附加的代码以及一些（可能很明显）我的图标切换不起作用的原因。任何想法？

我知道我已正确转换var崩溃并且其他部分正在运行，我已将警报添加到标记进程（我稍后将删除并移至控制台）。

这是HTML -

 <!-- Panel - Start Panel 5  -->
<div class='panel panel-default'>
<div class='panel-heading'>
<h4 class='panel-title'>
Phone and Email
<i class='indicator glyphicon glyphicon-question-sign  pull-right'></i>
</h4>
</div>
<div id='pnl_agency_contact' class='panel-collapse collapse'>
<div class='panel-body'>

<div class='form-group'>
<label>Agency Primary Phone</label>
    <div class='input-group'>
    <span class='input-group-addon'><i class='fa fa-phone'></i></span>
    <input type='text' class='form-control' id='phone' name='phone' value='' required >
    </div>

</div>
<script> 
$(document).ready(function() {
    $('#phone').mask('(999) 999-9999',{placeholder:'#'});
});
</script>

<div class='form-group'>
<label>Agency Primary Fax</label>
    <div class='input-group'>
    <span class='input-group-addon'><i class='fa fa-phone'></i></span>
    <input type='text' class='form-control' id='phone_fax' name='phone_fax' value='' required >
    </div>

</div>
<script> 
$(document).ready(function() {
    $('#phone_fax').mask('(999) 999-9999',{placeholder:'#'});
});
</script>

<!-- Form Text Input Required -->
<div class='form-group'>
<label>Agency Primary Email</label>
<div class='input-group'>
<span class='input-group-addon'><i class='fa fa-pencil'></i></span>  
<input type='email' id='email' name='email'  value='' class='form-control'  >
</div>
</div>



<a href='#' id='btn_step_two' name='btn_step_two' class='btn btn-success pull-right continue'>Next Step</a>
</div>
</div>
</div>
<!-- Panel - End  -->

这是Javascipt

function toggleChevron(e) {
        $(e.target)
            .prev('.panel-heading')
            .find("i.indicator")
            .toggleClass('glyphicon-question-sign glyphicon-ok-sign');
    }

$('.continue').click(function(e){
    e.preventDefault();
    var sectionValid = true;

    var collapse = $(this).closest('.panel-collapse.collapse');
    alert ('Checking Step Validation of ' + collapse.attr('id'));
        $.each(collapse.find('input, select, textarea'), function(){
            if(!$(this).valid()){
                $(this).parent('.form-group').addClass( "has-error has-feedback" );
                sectionValid = false;
                }
            else{
                $(this).parent('.form-group').removeClass("has-error has-feedback");
                $(this).parent('.form-group').addClass( "has-success has-feedback" );
                }   
            });

    if(sectionValid){
        alert ('Step Validate Complete!');
        collapse.collapse('toggle');
        toggleChevron(collapse);        
        collapse.parents('.panel').next().find('.panel-collapse.collapse').collapse('toggle');
    }

});