パネルの外側をクリックしても選択ボックスが閉じない

Question

サイトフィルタで作業していますが、問題が発生しています。私がbtn-selectを開いていて、パネルの外側をクリックするとselectが開いたままになります。私はBTN-選択の

<div class="dropdown pull-right" id="site-filter"> 
     <a class="dropdown-toggle filter-label" data-toggle="dropdown" href="#"> 
      Site Filter <i class="fa fa-filter"></i> 
     </a> 
     <div class="dropdown-menu"> 
      <div class="panel panel-primary"> 
       <div class="panel-heading"> 
        <h4>Site Filter</h4> 
       </div> 
       <div class="panel-body"> 
        <form role="form"> 
         <div class="input-group input-daterange" style=""> 
          <input type="text" class="input form-control" placeholder="Start Date"> 
          <span class="input-group-addon">to</span> 
          <input type="text" class="input form-control" placeholder="End Date"> 
         </div> 

         <a class="btn btn-select"> 
          <input type="hidden" class="btn-select-input" id="" name="" value="" /> 
          <span class="btn-select-value">Organization</span> 
          <span class='btn-select-arrow glyphicon glyphicon-chevron-down'></span> 
          <ul> 
           <li>Comapny Name</li> 
          </ul> 
         </a> 

         <a class="btn btn-select"> 
          <input type="hidden" class="btn-select-input" id="" name="" value="" /> 
          <span class="btn-select-value">State</span> 
          <span class='btn-select-arrow glyphicon glyphicon-chevron-down'></span> 
          <ul> 
           <li>Maryland</li> 
           <li>North Carolina</li> 
           <li>Pennsylvania</li> 
          </ul> 
         </a> 

         <a class="btn btn-select"> 
          <input type="hidden" class="btn-select-input" id="" name="" value="" /> 
          <span class="btn-select-value">City</span> 
          <span class='btn-select-arrow glyphicon glyphicon-chevron-down'></span> 
          <ul> 
           <li>Baltimore</li> 
           <li>Charlotte</li> 
           <li>Raleigh</li> 
          </ul> 
         </a> 
         <hr /> 
         <button type="reset" class="btn btn-primary btn-outline">Reset</button> 
        </form> 
       </div> 
      </div> 
     </div> 
<script> 
$(document).ready(function() { 
$(document).on('click', '.btn-select', function (e) { 
    e.preventDefault(); 
    var ul = $(this).find("ul"); 
    if ($(this).hasClass("active")) { 
     if (ul.find("li").is(e.target)) { 
      var target = $(e.target); 
      target.addClass("selected").siblings().removeClass("selected"); 
      var value = target.html(); 
      $(this).find(".btn-select-input").val(value); 
      $(this).find(".btn-select-value").html(value); 
     } 
     ul.hide(); 
     $(this).removeClass("active"); 
    } 
    else { 
     $('.btn-select').not(this).each(function() { 
      $(this).removeClass("active").find("ul").hide(); 
     }); 
     ul.slideDown(300); 
     $(this).addClass("active"); 
    } 
}); 
}); 
</script> 

Answer 1

$("#site-filter").click(function() { 
     var target = $(this).find(".active"); 
     console.log(target); 

     $(target).each(function() { 
      target.removeClass(".active"); 
      target.find("ul").hide(); 
     }); 
    }); 

が問題