I'm creating my own autocomplete input in Blazor. (something like below)

function FocusOut()
{
  document.getElementById("list-item-one").innerHTML = "Focus out";
}

function Click()
{
  document.getElementById("list-item-one").innerHTML = "Click";
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="search" onfocusout="FocusOut()" />
<ul class="dropdown">
  <li id="list-item-one" onclick="Click()">List Item One</li>
</ul>

When I click on the list item, the onfocusout event fires instead of the onclick event. Is there a way to "push" the onclick event?

This isn't a parent child relation, so "stopPropagation" has no effect. Also I know there is a datalist tag, but i'm not using it because of the way it look, feels and behaves in the different browsers.