如何在 JavaScript 中“等待”

Question

我有一个用 jQuery 用 javascript 编写的小型 Chrome 扩展程序，它应该从网页中获取一些数据。目标 HTML 如下所示：

<div id="options">

  <div class="option"><div class="checkbox">1</div></div>

  <div class="option"><div class="checkbox">3</div></div>

  <div class="option"><div class="checkbox">5</div></div>

  <div class="option"><div class="checkbox">Other value</div></div>

  ...

</div>

<div id="result">0</div>

当任何一个.checkbox被选中时#result都会改变。我的任务是.checkbox一项一项检查并获得#result每个。

var result = {};

// for each checkbox

$('#options .option').each(function(){

  // check it

  this.click()

  // wait a bit. Of course ideally if we can wait while #result is not changed but in practice sometimes checkbox doesn't change the result. So it will be enough to wait a few seconds

  // store data

  result[this.text()] = $('#result').text();

  // uncheck the checkbox

  this.click()

  // wait

});

console.log(result);

任何想法如何正确等待？谢谢

UPD：一个显示我的问题的小例子https://codepen.io/mihajlo-osadchij/pen/MNyazz