He aquí cómo hacerlo en 3 pasos:

PASO 1:

Crear un nuevo archivo menu.js y ponlo en tu Tema hijo de Divi (en mi caso mi Child theme se llama derma):

Coloque el siguiente código en el archivo menu.js:

jQuery(document).ready(function($){
    function ds_setup_collapsible_submenus() {
        var $menu = $('.et_mobile_menu'),
            top_level_link = '.et_mobile_menu .menu-item-has-children > a';
 
        $menu.find('a').each(function() {
            $(this).off('click');
            if ( $(this).is(top_level_link) ) {
                $(this).attr('href', '#');
            }
            if ( ! $(this).siblings('.sub-menu').length ) {
                $(this).on('click', function(event) {
                    $(this).parents('.mobile_nav').trigger('click');
                });
            }
            else {
                $(this).on('click', function(event) {
                    event.preventDefault();
                    $(this).parent().toggleClass('visible');
                });
            }
        });
    }
    setTimeout(function() {
        ds_setup_collapsible_submenus();
    }, 700);
});

PASO 2:

Enlazar el menu.js en la pestaña de integración en Divi >> Opciones del tema >> Integración >> Añadir código al de tu blog.

En mi caso, el código (la ruta completa al archivo menu.js) es:

<script type='text/javascript' src='https://derma-am.com/wp-content/themes/derma/menu.js'></script>

PASO 3:

Añade el siguiente código en tu Divi's estilo.css:

/* Closing sub menu - mobile version */
.et_pb_menu .et_mobile_menu .menu-item-has-children > a,
#main-header .et_mobile_menu .menu-item-has-children > a {
    background-color: transparent;
    position: relative;
}
 
.et_pb_menu .et_mobile_menu .menu-item-has-children > a:after, #main-header .et_mobile_menu .menu-item-has-children > a:after {
    font-family: 'ETmodules', sans-serif;
    text-align: center;
    speak: none;
    font-weight: 500;
    font-variant: normal;
    text-transform: none;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    font-size: 14px;
    font-style: italic;
    content: '\4c';
    top: 11px;
    right: 13px;
}
 
.et_pb_menu .et_mobile_menu .menu-item-has-children.visible > a:after,
#main-header .et_mobile_menu .menu-item-has-children.visible > a:after {
    content: '\4d';
}
 
.et_pb_menu .et_mobile_menu ul.sub-menu,
#main-header .et_mobile_menu ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li ul.sub-menu {
    display: none !important;
    visibility: hidden !important;
    transition: all 1.5s ease-in-out;
}
 
.et_pb_menu .et_mobile_menu li.visible > ul.sub-menu,
#main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l #main-header .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_fullwidth_menu .et_mobile_menu li.visible > ul.sub-menu,
.et-db #et-boc .et-l .et_pb_menu .et_mobile_menu li.visible > ul.sub-menu {
    display: block !important;
    visibility: visible !important;
}

Puede añadir cualquier texto en: línea 19 (por ejemplo): contenido: 'open \4c'; y en la línea 26 (por ejemplo): contenido: 'cerrar \4d';

¡Voilà!

Disfruta 🙂 .

Saludos