Why does my promise get into the pending state?

Question

I need to implement the following algorithm.

1. Set expectations for the appearance of the class '.cdn_download_item'
2. Click on the link (only after that the class '.cdn_download_item' appears)
3. Triggering DOM Inserted=>Make a list of links and display them

Now I have a Promise {} inside which there is a list that I need, in principle everything worked, but why is the state of the promise pending, and not fulfilled? And how to make it fulfilled?

(async function() {
  var returnArray = new Array();

  function wait(selector) {
    return new Promise((resolve) => {
      const listener = () => {
        const node = document.querySelector(selector);
        if (node) {
          document.removeEventListener('DOMNodeInserted', listener);
          resolve(node);
        }
      };
      document.addEventListener('DOMNodeInserted', listener);
    });
  }

  function myclick() {
    return new Promise(resolve => {
      var a = document.querySelector('#dle-content > div.section > ul > li:nth-child(3)').click();
      resolve(a);
    })
  }


  async function myf() {
    let res0 = await myclick();
    let res1 = await wait('.cdn_download_item').then(() => {
      var elements = Array.from(document.querySelectorAll('.cdn_download_item span:first-child'));
      var linksArray = new Array();
      for (element of elements) {
        linksArray.push(element.innerText);
      }
      returnArray.push(linksArray);
    })

    let res2 = await returnArray;
    return res2;
  }

  return myf();
})();