Jquery 垂直多级菜单，下一级应显示在悬停状态

这张图片显示的是垂直菜单，但它被展开了。我只想首先显示父标签，悬停时应显示下一级，依此类推

function display_children($parent, $level, $categoryModel) {

    $result = $categoryModel->get_category($parent);
    echo "<ul>";
    foreach ($result as $row) :
        if ($row['Count'] > 0) {
            echo "<li><a href='" . base_url() . "/index.php/advertisement/category/" . $row['category_id'] . "'>" . $row['category_name'] . "</a>";
            display_children($row['category_id'], $level + 1, $categoryModel);
            echo "</li>";
        } elseif ($row['Count'] == 0) {
            echo "<li><a href='" . base_url() . "/index.php/advertisement/category/" . $row['category_id'] . "'>" . $row['category_name'] . "</a></li>";
        } 
            else;
    endforeach;
    echo "</ul>";
}

这是我的代码，我需要css。这是递归逻辑，这就是为什么我感到困惑。我发现很多css，但它有水平菜单列表。我需要垂直菜单列表

---

在这里，我列出了一个随机列表。这里的诀窍是使用CSS级联对我们有利。我把每一个UL都藏在另一个UL里面，这是自然隐藏的。然后，我让每一个完全是盘旋李的孩子的UL展示他们自己

保险商实验室{ /*如果子弹在外面，悬停效果将闪烁*/ 列表样式位置：内部； } ul{ 显示：无； } 李：悬停>ul{ 显示：块； } A. B C D E F G H 我 J K L