Сортировка списка на основе пользовательского ввода на веб-странице

Все, что вы делаете в javascript, - это как-то async (кроме promt), поэтому вам просто нужно ждать пользователя, нажимающего один из div. Для этого мы просто создаем Promise, которая разрешается, когда событие click происходит на определенном элементе:

function wasClicked(el) {
  return new Promise((resolve) => {
    el.addEventListener("click", function handler() {
        el.removeEventListener("click", handler);
        resolve(el);
    });
  });
}

Затем вы можете изменить свое сравнение на:

static async function compare(a, b) { // <- should be static
  console.log("comparing " + a.name + " to " + b.name);
  a.set1();
  b.set2();
  console.log("after display");

  const pic1 = document.getElementById("pic1");
  const pic2 = document.getElementById("pic2");

  const choice = await Promise.race(wasClicked(pick), wasClicked(pic2));
 return choice === pic1 ? 1 : -1;
}

Теперь мы только нужен способ сортировки массива asynchronoulsy, но это довольно просто:

 async function asyncSort(array, comparator) {
   for(let i = 0; i < array.length - 1; i++) {
     if(await comparator(array[i], array[i + 1]) < 0) {
        ([array[i], array[i + 1]] = [[array[i + 1], array[i]]);
        i -= 2;
     }
   }
}

Итак, теперь вы можете сделать:

asyncSort(someArray, Character.compare);

PS: классы должны по договоренности просто содержат методы, которые являются «признаками» класса, например Character.speak(), ни set1, ни set2 не делают этого так, чтобы они не были методами Character