jquery – 在页面重新加载后在复选框列表中移动复选标记 – 仅限Firefox

每当我在列表(ol,ul,dl)中放入复选框,然后在列表上方动态插入按钮时,我就会在Firefox中遇到一些奇怪的行为.如果我从一个像这样的简单列表开始：

<dl class="c">
    <dt><label for="a1"><input type="checkBox" id="a1" />one</label></dt>
    <dt><label for="a2"><input type="checkBox" id="a2" />two</label></dt>
    <dt><label for="a3"><input type="checkBox" id="a3" />three</label></dt>
</dl>

并添加一些像这样的jQuery：

$(document).ready(function(){
    var a = $('<button type="button">a</button>');
    var b = $('<button type="button">b</button>');
    $('<div/>').append(a).append(b).insertBefore($('.c'));
});

…然后在Firefox中打开它,它起初看起来很好.但是检查第一个复选框,重新加载页面,复选标记跳转到第二个框.再次重新加载,它跳到第三个.再次重新加载,并且不会选中任何复选框.

如果我通过删除其中一个追加呼叫而忽略其中一个按钮,那就没问题了.如果我将按钮更改为div或类似的东西,那很好.如果我用div替换dl标签(并摆脱dt标签),那很好.但我需要两个按钮,并且复选框必须在我正在尝试构建的列表中.

有人知道是什么原因引起的吗？