Why one event method refresh page before execution?

Im simple trying to validate this input but when I use one event method, it refreshes the page before it works, and then I have to retype the input value.I used one event method because i was trying to stop the element from appending more than once.Here is the code:

const executeSearch = (event) => {
  event.preventDefault()
  const city = $input.val();
  if(city === ''){
   $validate.append(`<span>Enter a city</span>`)
  }else{
    $validate.empty()
    $venueDivs.forEach(venue => venue.empty());
    $weatherDiv.empty();
    $destination.empty();
    $result.css("display", "none")
    $container.css("visibility", "visible");
    getVenues().then(venues => renderVenues(venues))
    getForecast().then(forcast =>renderForecast(forcast))
    return false;
  }

}

$submit.one('click',executeSearch)