I put **** in some places because the production is too long. my aim is: I don't want it to switch to the 2nd foreach list until all the operations in the 1 foreach list are finished. I used arguments.callee until that element came inside, because when I clicked somewhere on the site where I was going to process, a loading site opened and waited. For the line where I use the item element, it gives the error "Uncaught SyntaxError: Invalid left-hand side in assignment".

var asd = (async()=>{
    var list = ["******","******"];
    list.forEach(async (item) =>  {
        await document.querySelector("******").click();
        await document.querySelector("******").click();
        await document.querySelector("******").click();

        (async function()  {
            if(document.querySelector("*****").className.indexOf("*****") == -1) {
                await document.querySelector("*****").select();
                await document.querySelector("*****").value="name : "+item;
                const event = await $.Event('keyup');
                event.which = 13;
                event.keyCode = 13;
                await $('*****').trigger(event);
            }
            else setTimeout(arguments.callee, 1000);
        })
    })
})
asd();