Javascript滚动选择收藏夹按钮

我需要添加一个收藏夹按钮，它可以在标准选择中的每个选项上打开和关闭。我正在使用引导设置选择的样式。具体来说，我需要创建一个UI元素，它允许我滚动浏览选项，并在滚动到新元素时处理事件。我想扩展它，在每个选项的左侧包含一个切换按钮，这样我就可以将一个选项标记为收藏夹

HTML

---

如何为每个选项添加一个可以打开和关闭的收藏夹按钮？我对模拟这种行为的替代工具持开放态度

也许你的意思是这样的？在div上有一个复选框，用户在其中单击该选项并类触发您的事件？在事件内部，您可以使用this关键字引用正在单击的项目

HTML

---

“收藏”按钮是什么意思？所以当你滚动到某个点时，它会选择其中一个按钮“收藏”按钮，我指的是我可以添加到每个选项中的按钮，该按钮可以在收藏和非收藏之间切换。我应该能够处理一个事件，当一个选项是有利的/不利的。这不是我要找的。切换按钮应与选择框中的每个选项相关联。现在，如果您可以将复选框放在选择框中每个选项的旁边。。。那更像是我在寻找的东西。

<form>   
  <select id="scrollbox" multiple class="form-control target">
      <option>Option 1</option>
      <option>Option 2</option>
      <option>Option 3</option>
      <option>Option 4</option>
      <option>Option 5</option>
  </select>  
</form>

<div id="other">
  Trigger the handler
</div>

$( ".target" ).change(function() {
  var e = document.getElementById("scrollbox");   
  document.getElementById("other").innerHTML = e.value;
});

 <form>   
      <div id="scrollbox" class="" sytle="display: block">
          <div id="1">Option 1 <input type='checkbox' class='handleFavorite'>Favorite</div>
          <div id="2">Option 2 <input type='checkbox' class='handleFavorite'>Favorite</div>
          <div id="3">Option 3 <input type='checkbox' class='handleFavorite'>Favorite</div>
          <div id="4">Option 4 <input type='checkbox' class='handleFavorite'>Favorite</div>
          <div id="5">Option 5 <input type='checkbox' class='handleFavorite'>Favorite</div>
      </div>  
    </form>

$(".handleFavorite").click(function(){ alert('you clicked me')});