Using jQuery UI to open and close search box?

I’m setting up an autocomplete search box.

Here’s my current code:

$(document).ready(function(){
 
 $('#txtSearch').autocomplete({
     source: "https://example.com/search.php",
     minLength: 1,
     select: function(event, ui) {
         var url = ui.item.id;
         if (url != '#') {
             location.href = 'https://' + location.hostname + '/' + url
         }
     },
     open: function(event, ui) {
         $(".ui-autocomplete").css("z-index", 1000)
         $('.exo-search').css('border-bottom-left-radius','0');
         $('.exo-search').css('border-bottom-right-radius','0');
     }
 })
 
});

You can see here that someone starts typing and the results are loading, it sets the bottom border radius to 0.

 open: function(event, ui) {
     $(".ui-autocomplete").css("z-index", 1000)
     $('.exo-search').css('border-bottom-left-radius','0');
     $('.exo-search').css('border-bottom-right-radius','0');
 }

But if someone clicks away from the search box, the dropdown of results disappears like it’s supposed to, but the bottom border radius is still set to 0 instead of resetting back to 5px like it normally is.

Is there something wrong with my code or is that the normal behavior and I need to add something else?