Javascript 对元素排序后，工具提示将停止工作

我有一个元素列表，可以使用我在stackoverflow上找到的javascript按price或pax的升序/降序重新排序：

var priceAscending = false;
var ratingAscending = true;

$('.container').on('click','.sortbyprice',function(){
ratingAscending = true;
var sorted = $('.listings').sort(function(a,b){
    return (priceAscending ==
           (convertToNumber($(a).find('span').html()) < 
            convertToNumber($(b).find('span').html()))) ? 1 : -1;
});
priceAscending = priceAscending ? false : true;

$('.results').html(sorted);
})
$('.container').on('click','.sortbypax',function(){ 
priceAscending = true;
var sorted = $('.listings').sort(function(a,b){
    return (ratingAscending ==
           (parseFloat($(a).find('.pax').html()) < 
            parseFloat($(b).find('.pax').html()))) ? 1 : -1;
});
ratingAscending = ratingAscending ? false : true;

$('.results').html(sorted);
});

var convertToNumber = function(value){
 return parseFloat(value.replace('$',''));
}

var=false；
var比率设定=真；
$（'.container'）。在（'click'，'.sortbyprice'，函数（）上{
评级设定=真；
var sorted=$（'.listings'）.sort（函数（a，b）{
返回（价格上升）==
（convertToNumber（$（a）.find（'span'）.html（））<
convertToNumber（$（b）.find（'span'）.html（））？1:-1；
});
价格上升=价格上升？假：真；
$（'.results'）.html（已排序）；
})
$（'.container'）。在（'click'，'.sortbypax'，函数（）上{
价格上升=真；
var sorted=$（'.listings'）.sort（函数（a，b）{
返回（额定值设定）==
（parseFloat（$（a）.find（'.pax'）.html（））<
parseFloat（$（b）.find（'.pax'）.html（））？1:-1；
});
ratingAscending=ratingAscending？false：真；
$（'.results'）.html（已排序）；
});
var CONVERTONUMBER=函数（值）{
返回parseFloat（value.replace（'$'，''）；
}

我不确定上面的代码写得有多好（因为我认为问题出在这里），但我不是javascript专家，所以我不知道

然后我还有一个插件可以显示工具提示

现在请看我的

问题：

1） 在单击“按价格排序”或“按PAX排序”之前，请将鼠标悬停在价格下方较小的数字上以查看其工具提示

2） 现在单击按价格排序或按PAX排序，然后再次尝试将鼠标悬停在小数字上。您会注意到工具提示不再起作用

如果您刷新页面或按RUN in Js Fiddle，那么工具提示将一直工作，直到您再次对它们进行排序

为什么会这样

---

在使用Tooltipster插件之前，我实际上是在使用该插件，但当我遇到上述问题时（是的，同样的问题也发生在该插件上），我决定使用另一个插件（Tooltipster），因为我认为可能与MiniTip存在某种冲突。看起来问题可能在于排序javascript代码？

当HTML被覆盖时，工具提示插件丢失元素也就不足为奇了

与此相反：

$('.results').html(sorted);

…这样做：

$('.results').append(sorted);

这将在不覆盖元素的情况下将元素移动到正确的顺序

尽管名称不同，当您使用现有元素调用

append（）

时，它会被移动而不是添加。但是当您调用

html（）

时，您正在覆盖已经存在的内容。工具提示插件在现有元素上工作，因此当它们被覆盖时会丢失它们

此外，您还可以简化此操作：

priceAscending = priceAscending ? false : true;

……为此：

priceAscending = !priceAscending;

---

元素对排序后的悬停肯定没有响应（浏览器的开发工具会突出显示这一点）。很棒的东西！工作起来像个美人！我实际上是在看$（'.results'）.html（排序）；作为嫌疑犯，但因为我是javascript弱智，这是我唯一能做的事。。。看看它！！英雄联盟这和appendto代码有什么区别？原来我想得太多了。您不需要

each（）

。请参阅我的最新答案。谢谢Rick，感谢您对此事的长期支持