Javascript jQuery单击排序并重置未正常工作

我有以下简单的HTML标记：

<div class="sorter">
    <i class="fa fa-sort"></i>
</div>
<div class="market-slider">
    <div class="market-search">
        <div class="market-inner-item" data-position="1"> .. </div>
        <div class="market-inner-item" data-position="2"> .. </div>
        <div class="market-inner-item" data-position="3"> .. </div>
        <div class="market-inner-item" data-position="4"> .. </div>
    </div>
</div>

问题: 它起作用了。它利用HTML5数据属性，例如data position=4来确定div的顺序。我希望能够单击排序按钮，并使结果排序或以相反的顺序显示

---

简单英语：我点击-它按降序排序。我再次单击-它在Asc中排序恢复正常。我再次单击-过程重复，以此类推。

您可以使用计数器

var elm = $('.sorter i.fa-sort');
elm.data("what", "sort")
elm.click(function(e) {
    if (elm.data("what") == "sort") {
        $(".market-slider .market-inner-item").sort(sort_li).appendTo('.market-slider');
        $(this).data("what", "reverse");
    } else {
        $(".market-slider .market-inner-item").sort(sort_li).reverse().appendTo('.market-slider');
        $(this).data("what", "sort");
    }
    function sort_li(a, b) {
        return ($(b).data('position')) > ($(a).data('position')) ? 1 : -1;
    }
    e.preventDefault();
});

var elm = $('.sorter i.fa-sort');
elm.data("what", "sort")
elm.click(function(e) {
    if (elm.data("what") == "sort") {
        $(".market-slider .market-inner-item").sort(sort_li).appendTo('.market-slider');
        $(this).data("what", "reverse");
    } else {
        $(".market-slider .market-inner-item").sort(sort_li).reverse().appendTo('.market-slider');
        $(this).data("what", "sort");
    }
    function sort_li(a, b) {
        return ($(b).data('position')) > ($(a).data('position')) ? 1 : -1;
    }
    e.preventDefault();
});