Appearance and disappearance of element lists in js?

Question

JavaScript

Guys please help me with the code.
There is such a script

$(document).ready(function(){				
  $('.menu-icon').click(function(){	
    $('.menuTrigger').toggleClass('menuToggle');
    $('.overlay-box').toggleClass('open');
    $(function() {
        $('.menu ul li').each(function(i) {
        $(this).delay((i++) * 200).fadeTo(1000, 1); })
    });
    
  });
});

He performs the animation of the menu icon + the appearance and disappearance of the menu + the appearance and disappearance of the menu list in turn. But it works only 1 time after refreshing the page, I'm talking about "the appearance of the menu list in turn", but you need it to work all the time.

Answer 1

Why did you wrap it in a function here, you know?

$(function() {
  $('.menu ul li').each(function(i) {
  $(this).delay((i++) * 200).fadeTo(1000, 1); })
});