Display submenu when hovering but don't hide it when un-hovering

I have a very simple multilevel menu, like so:

HTML:

<ul class="multilevel">
<li>...</li>
<li>...</li>
<li>...</li>
<li>
    <ul>
        <li>...</li>
        <li>...</li>
        <li>...</li>
    </ul>
</li>
</ul>

CSS:

.multilevel > li {position: relative; display: inline-block}
.multilevel ul {display: none; position: absolute;}
.multilevel > li:hover ul {display: block;}

When un-hovering, i want the submenu to stay on and not hide. Is it possible using just CSS? Or do i need to use jQuery (in my case). If yes, how do i use jQuery so the menu stays on when hovering with css?