javascript:单击后如何替换select:图标？

<div class="custom-select">
  <div class="select-icon"></div>
  <select class="original-select">
    <option value="option1">Option 1</option>
    <option value="option2">Option 2</option>
    <option value="option3">Option 3</option>
  </select>
</div>

.custom-select {
  position: relative;
  width: 200px;
}

.select-icon {
  position: absolute;
  top: 0;
  right: 0;
  width: 20px;
  height: 20px;
  background-image: url('custom-icon.png');
  /* 其他样式属性 */
}

.original-select {
  display: none;
}

const selectIcon = document.querySelector('.select-icon');
const originalSelect = document.querySelector('.original-select');

selectIcon.addEventListener('click', function() {
  // 显示/隐藏自定义下拉框
  // 可以使用CSS的display属性或者添加/移除特定的类来实现
});

originalSelect.addEventListener('change', function() {
  // 处理选项选择
  // 更新替代的图标元素的内容
  // 关闭下拉框
});