Updated tab navigation in job application.

cmsWebApp/webroot/extensions/adminportal/inc/view_application_tab_applicant.jsp

@@ -13,6 +13,15 @@
 %>
 
 <oneit:dynIncluded>
+<script>
+    function tabToggle(tab) {
+        $(".nav-justified li").each(function() {
+            $(this).removeClass('active');
+        });
+
+        $(tab).addClass('active');
+    }
+</script>
 
 <div class="main-applicant-content">
     <div class="applicant-header">
@@ -44,19 +53,19 @@
     <div class="applicant-sub-part">
         <div class="applicant-left">
             <div class="applicant-progress">
-                <div class="col-sm-4 col-xs-12 text-center" href="#1a" data-toggle="tab"    id="progress1">
+                <div class="col-sm-4 col-xs-12 text-center" href="#1a" data-toggle="tab"    id="progress1"  onClick="tabToggle('#tab1')">
                     <label class="progress-label">role fit</label>
                     <div class="percent-green fixed-width">
                         <p style="display:none;">83%</p>
                     </div>
                 </div>
-                <div class="col-sm-4 col-xs-12 text-center" href="#2a" data-toggle="tab"    id="progress2">
+                <div class="col-sm-4 col-xs-12 text-center" href="#2a" data-toggle="tab"    id="progress2"  onClick="tabToggle('#tab2')">
                     <label class="progress-label">culture fit</label>
                     <div class="percent-green fixed-width">
                         <p style="display:none;"><oneit:toString value="<%= jobApplication.getCulturePercentage() %>"   mode="PercentageWholeNumber" /></p>
                     </div>
                 </div>
-                <div class="col-sm-4 col-xs-12 text-center" href="#4a" data-toggle="tab"    id="progress3">
+                <div class="col-sm-4 col-xs-12 text-center" href="#3a" data-toggle="tab"    id="progress3"  onClick="tabToggle('#tab3')">
                     <label class="progress-label">requirements</label>
                     <div class="percent-blue fixed-width">
                         <p style="display:none;"><oneit:toString value="<%= jobApplication.getCriteriaPercentage() %>"   mode="PercentageWholeNumber" /></p>
@@ -65,10 +74,10 @@
             </div>
             <div class="applicant-tab">
                 <ul class="nav nav-pills nav-justified">
-                    <li class="active"><a href="#1a" data-toggle="tab">role fit</a>s</li>
-                    <li><a href="#2a" data-toggle="tab">culture fit</a></li>
-                    <li><a href="#3a" data-toggle="tab">requirements</a></li>
-                    <li><a href="#4a" data-toggle="tab">areas of concern</a></li>
+                    <li id="tab1" class="active"><a href="#1a" data-toggle="tab">role fit</a>s</li>
+                    <li id="tab2"><a href="#2a" data-toggle="tab">culture fit</a></li>
+                    <li id="tab3"><a href="#3a" data-toggle="tab">requirements</a></li>
+                    <li id="tab4"><a href="#4a" data-toggle="tab">areas of concern</a></li>
                 </ul>
                 <div class="tab-content clearfix">
                     <div class="tab-pane active" id="1a">