Bootstrap - clear input

I am trying to use Bootstrap 3 and wanting to add clear on each textbox. It is not working. How should I fix it?

Javascript
    
            $(document).ready(function(){
                $(".TextBox").keyup(function(){
                    $(this).siblings(".searchclear").toggle(Boolean($(this).val()));
                });
                $(".searchclear").toggle(Boolean($(".TextBox").val()));
                $(".searchclear").click(function(){
                    $(".searchinput").val('').focus();
                    $(this).hide();
                });
            });
            
            
            
CSS
            
             .searchinput {
    width: 200px;
}

.searchclear {
    position:absolute;
    right:5px;
    top:0;
    bottom:0;
    height:14px;
    margin:auto;
    font-size:14px;
    cursor:pointer;
    color:#ccc;
}



HTML

<div class="btn-group">
 
   <asp:TextBox ID="UserID" runat="server" class="form-control" placeholder="UserID" autofocus></asp:TextBox>
  <span id="searchclear" class="searchclear glyphicon glyphicon-remove-circle"></span>
</div>

<div class="btn-group">

   <asp:TextBox ID="Password" runat="server" TextMode="Password" class="form-control" placeholder="Password"></asp:TextBox>
  <span id="searchclear" class="searchclear glyphicon glyphicon-remove-circle"></span>
</div>

Select allOpen in new window