I need to sort the songs based on the series title and type of the song.

I'm using jQuery UI Menu:

```
<ul id="menu"></ul>

for(y = 0; y<tytuly.length; y++){
    $('<li><div>'+tytuly[y]+'</div><ul><li><div>Openingi</div><ul id="ops'+y+'"></ul></li><li><div>Endingi</div><ul id="eds'+y+'"></ul></li><li><div>Inserty</div><ul id="ins'+y+'"></ul></li></ul></li>').appendTo('#menu');
}

```

![Full structure of menu](https://i.stack.imgur.com/RjQfJ.png)

I load content using Ajax (Example Data): `[{"nr_wpisu":"1","id":"39","typ":"1","link":"https:\/\/animethemes.moe\/video\/KakumeikiValvrave-OP1.webm","tytul_autor":"Preserved Roses","tytul":"Kakumeiki Valvrave"},{"nr_wpisu":"43","id_anime":"36","typ":"2","link":"https:\/\/animethemes.moe\/video\/MaouGakuinNoFutekigousha-ED1.webm","tytul_autor":"Hamidashimono - Tomori Kusunoki","tytul":"Maou Gakuin no Futekigousha: Shijou Saikyou no Maou no Shiso, Tensei shite Shison-tachi no Gakkou e"}]`

In the content loaded there are few records with the same title id, so I made an array without copies
Then I have the list of songs, that I have to sort by the title/title\_id and their type, then append it to the correct `<ul>`

Earlier I was using:

```js
var tytuly = ["title","title2","title3","title4","title5","title6","title7","title8","title9"]; 
for(y = 0; y<tytuly.length; y++){
$('<li><div>'+tytuly[y]+'</div><ul><li><div>Openingi</div><ul id="ops'+y+'"></ul></li><li><div>Endingi</div><ul id="eds'+y+'"></ul></li><li><div>Inserty</div><ul id="ins'+y+'"></ul></li></ul></li>').appendTo('#menu');
            }
                $(function(){
        $("#menu").menu();
      });

      var unflist = [];
      var link = ["link","link","link","link","link","link","link","link","link"];
    var type = [1,1,2,2,2,3,3,1,1];
    var tyt_art = ["test","test","test","test","test","test","test","test","test"];
    for (q = 0; q <= 8; q++) {
      if (type[q] == 1) {
        $('<li class="op' + q + '"></li>').appendTo('body #ops');
        $('<div/>').text(tyt_art[q]).appendTo('body .op' + q);
      }
      if (type[q] == 2) {
        $('<li class="ed' + q + '"></li>').appendTo('body #eds');
        $('<div/>').text(tyt_art[q]).appendTo('body .ed' + q);
      }
      if (type[q] == 3) {
        $('<li class="ins' + q + '"></li>').appendTo('body #ins');
        $('<div/>').text(tyt_art[q]).appendTo('body .ins' + q);
      }
      unflist.push(link[q]);
    }
```

```html
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
  <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
  <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<ul id="menu">
</ul>
```

[It should look like this](https://i.stack.imgur.com/R2dQB.png)

But the sorting at this moment is not working correctly.
[enter image description here][3]