实现CSS，选择中的自定义选项在页面刷新时无法正常工作

Question

我使用materialize css并想使用自定义下拉列表。 我想要完成的是有一个选项可以打开模态窗口。

<select>
  <option>some option</option>
  <option>some option</option>
  <option class="custom-option"><a href="#myModal" class="modal-trigger">Open modal</a></option>
</select>

在JS中我跑。

$('select').materialize_select();

但这会删除<a>标记，而我无法以这种方式打开我的模式。

如果我用以下代码替换JS：

$('.custom-option').html('<a href="#myModal" class="modal-trigger">Open modal</a>');
$('select').materialize_select();

有效。我不明白为什么说实话。

我的问题是，如果我在选择自定义选项时刷新页面，我将会看到

<a href="#myModal" class="modal-trigger">Open modal</a>

在选择框内看起来很难看。我想要的是显示只是

Open modal

有什么想法吗？