仅设置引导导航的插入符切换下拉导航而不是文本

Question

鉴于以下引导程序导航，如何仅设置插入符号（向下箭头）以切换子导航，当用户单击文本链接时，它会将它们带到给定页面？

HTML

<nav class="navbar navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-nav" aria-expanded="false"> <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>

      </button>
      <a class="navbar-brand" href="#"><img src="../images/logo.png"></a>

      <ul class="btn btn-default profile-btn nav-contact">
      <h3>000-000-0000</h3>
      <p><span class="phone">24/7</span> Se habla español</p>
      </ul>
      <a href="tel:000-000-0000"><i class="nav-contact-mobile fa fa-phone"></i></a>

    </div>
    <div class="collapse navbar-collapse" id="bs-nav">
      <div class="row mobile-search">
          <input type="text" class="form-control" id="inputPassword3" style="width:100%" placeholder="Search...">
      </div>
      <ul class="nav navbar-nav navbar-left">

        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">MAIN LINK<span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="#">LINK</a></li>
            <li><a href="#">LINK</a></li>
            <li><a href="#">LINK</a></li>
            <li><a href="#">LINK</a></li>
            <li><a href="#">LINK</a></li>
          </ul>
        </li>
        <li class="dropdown mega-dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown">MAIN LINK <b class="caret"></b></a>
                <ul class="dropdown-menu columns-3">
                    <div class="row">
                        <div class="col-md-4 col-sm-4 col-xs-12 hidden-xs image-column">
                    <ul>
                      <div class="carousel-inner">
                        <div class="item active hidden-xs">
                          <a href="#"><img src="../images/img.png" class="img-responsive" alt=""></a>
                          <h4 class="picture-sub">LINK</h4>
                        </div>
                        <div class="item active hidden-xs">
                          <a href="#"><img src="../images/img.png" class="img-responsive" alt=""></a>
                          <h4 class="picture-sub">LINK</h4>
                        </div>
                        <div class="item active hidden-xs">
                          <a href="#"><img src="../images/img.png" class="img-responsive" alt=""></a>
                          <h4 class="picture-sub">LINK</h4>
                        </div>
                      </div>
                    </ul>
                        </div>
                  <li class="col-md-4 col-sm-4 col-xs-12 subnav-column">
                    <ul>
                      <li class="dropdown-header">LINK</li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li class="dropdown-header">LINK</li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li class="dropdown-header">LINK</li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                    </ul>
                  </li>
                  <li class="col-md-4 col-sm-4 col-xs-12 subnav-column">
                    <ul>
                      <li class="dropdown-header">LINK</li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li class="dropdown-header spacer">LINK</li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li class="dropdown-header spacer">LINK</li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li><a href="#">Link</a></li>
                      <li class='see-all'><a href="#">Links</a></li>
                    </ul>
                  </li>
                    </div>
                </ul>
            </li>

        <li class="dropdown">
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">MAIN LINK<span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="#">LINK</a></li>
            <li><a href="#">LINK</a></li>
          </ul>
        </li>
        <li class="dropdown"><a href="#" class="dropdown-toggle">NEWS</a></li>
        <li class="dropdown"><a href="#" class="dropdown-toggle">LOCATIONS</a></li>
        <li class="dropdown"><a href="#" class="dropdown-toggle">CONTACT</a></li>
        <li class="dropdown hidden-xs"><a href="#" class="dropdown-toggle"><i class="fa fa-search"></i></a></li>

        <li class="mobile-footer"><a href="#">FAQs</a></li>
        <li class="mobile-footer"><a href="#">TERMS & CONDITIONS</a></li>
        <li class="mobile-footer"><a href="#">EMPLOYMENT</a></li>
        <div class="follow-us">
          <p>Follow Us</p>
          <i class="fa fa-facebook"></i>
          <i class="fa fa-twitter"></i>
          <i class="fa fa-google-plus"></i>
          <i class="fa fa-youtube"></i>
          <i class="fa fa-linkedin"></i>
        </div>
      </ul>
    </div>
  </div>
  <div class="row desktop-search">
    <div class="row">
       <div class="col-lg-12">
        <input type="text" class="form-control" id="inputPassword3" style="width:100%" placeholder="Search...">
      </div>
    </div>
  </div>
</nav>

当前状态：LINK TO FIDDLE