jQuery实现选项卡效果

先放一个html代码

<span class="gps">
        <a href="#">
          <span class="glyphicon glyphicon-map-marker" aria-hidden="true"></span>
          河南
        </a>
        <div class="adress">
          <p>热门城市：</p>
          <ul>
            <li>北京</li>
            <li>上海</li>
            <li>广州</li>
            <li>深圳</li>
            <li>厦门</li>
          </ul>
          <ul>
            <li>郑州</li>
            <li>杭州</li>
            <li>苏州</li>
            <li>西安</li>
            <li>成都</li>
          </ul>
          <ul>
            <li>稻城</li>
            <li>亚丁</li>
            <li>昆明</li>
            <li>桂林</li>
            <li>南阳</li>
          </ul>
          <ul>
            <li>方城</li>
            <li>三亚</li>
            <li>西藏</li>
            <li>济南</li>
            <li>西安</li>
          </ul>
        </div>
    </span>

下面是jQuery代码

$('.gps a').mouseenter(function(){
    $(this).css('background','white')
    $(this).next().css('display','block')
  })
  $('.adress').mouseenter(function(){
    $(this).css('display','block')
  })
  $('.gps a').mouseleave(function(){
    $(this).next().css('display','none')
  })
  $('.adress').mouseleave(function(){
    $(this).prev().css('background','#e3e4e5')
    $(this).css('display','none')
  })