Скрыть span при нажатии вне этого span js

$(document).ready( function() {
            $('#valuta').keyup(function(){
                if($(this).val().length > 0){
                    $.ajax({
                        type: "POST",
                        url:"/autocomplete/auto_val.php",
                        dataType: 'json',
                        data: {'choose' : $(this).val()},
                        success: function(res){
                            console.log(res);
                            var content = '';
                            $.each(res, function(i, item){
 
                                content += "<div class='ott_v' data-id='"+res[i].id_v+"'>"+res[i].name_v+"</div>";
                                $("#vl").css({"margin-top": "29px", "background": "#fff", "position": "absolute", "margin-left": "138px", "width": "170px", "border": "2px dashed #e0e0e0", "text-align": "left", "padding": "5px", "font-size": "15px"});
                            });
 
                            $('.val').html('');
                            $('.val').append(content);
                        }
 
                    });
                }else{
                    $('.val').html('');
                }
 
            });
 
            $('body').on( 'click', '.ott_v', function(){
 
                var id = $(this).attr('data-id');
                $('.user_id').val(id);
                var txt = $(this).text();
                $('#valuta').val(txt);
                $('.val').html('');
$("#vl").css({"display": "none"});
            });
 
        } );

$("#vl").css({"display": "none"});

$('body').on( 'click', '.ott_v', function(e){
  if (e.target != $("#vl")) $("#vl").css({"display": "none"});
});