JSFiddle - React, Tailwind, and code Playground

by geirby

HTML

<div id="nosort"></div>
<div id="sort"></div>
<div id="sort-condition">
    public <br />
    public <br />
    confirm <br />
    confirm <br />
    blocked <br />
    delete <br />
    moderation
</div>

CSS

div {
    display: inline-block;
    margin-left: 20px;
}

JavaScript

var listitem =  
	[{
        id: "122",
	    name: "moderation"
    },
     {
        id: "13",
	    name: "blocked"
    },
    {
        id: "2",
	    name: "confirm"
    },
     {
        id: "21",
	    name: "public"
    },
     {
        id: "26",
	    name: "public"
    },
     {
        id: "212",
	    name: "delete"
    },
     {
        id: "213",
	    name: "confirm"
    }
    ]
 
$.each(listitem, function(i, el){
    $('#nosort').append(el.name + '<br>');
})


listitem.sort(function(a){
    switch(a.name) {
        case 'public': return 2;
            break;
        case 'confirm': return 1;
            break;
        default: return -1;
    }
   //var compA = a.name.toUpperCase();
   //var compB = b.name.toUpperCase();

   //return (compA < compB) ? -1 : (compA > compB) ? 1 : 0;
});
$.each(listitem, function(i, el){
    $('#sort').append(el.name + '<br>');
})