Question

Let’s say I have a list item and in each list item is a span tag looking like this <span class="pos">1st</span> That goes from 1 to 5. So it’d be 1st, 2nd, 3rd, 4th, and 5th.

It’s a sortable list, so after you sort. I wanted it to update each span tag correctly with number and suffix. However, in the jsFiddle below, you will see that is not the case.

jsFiddle: http://jsfiddle.net/weka/4GN37/

Answer 1

Here is one solution:

update: function (event, ui) {
    $(".list span.pos").html(function(i) {
        var suf = ["st", "nd", "rd"];
        return (i + 1) + (suf[i] || "th");
    });
}

DEMO: http://jsfiddle.net/4GN37/2/