Multiple triggers for the same element

[mrhdias]

I have a menu, and I want it to display the submenu category when I hover the cursor over the 'li' element. However, when I click on the element, the category is shown in another element. How can I achieve this without using JavaScript?

<ul>
    <li hx-get="/submenu?category=a" hx-trigger="mouseover" hx-target="this" hx-swap="innerHTML"
        hx-get="/listcategory?category=a" hx-trigger="click" hx-target="#category" hx-swap="innerHTML">cat a</li>
    <li>cat b</li>
    <li>cat ...</li>
</ul>
<div id="category"></div>