JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="categories"></ul>

<script>
var snippets = [
  {title: 'snippet 1', content: 'hello there 1', category: 'javascript'},
  {title: 'snippet 2 ', content: 'hello there 2', category: 'wordpress'},
  {title: 'snippet 3', content: 'hello there 3', category: 'javascript'},
  {title: 'snippet 4', content: 'hello there 4', category: 'general'},
  {title: 'snippet 5', content: 'hello there 5', category: 'general'}
];

item = [];

$.each(snippets, function(i, v) {
    var data = '<li class="category">'+ v.category +' ';
      data += '<ul class="item"> <li> ' + v.title + ' </li> </ul>';
      data += '</li>';
      if (item[v.category] == undefined) {
      	item[v.category] = [];
      	item[v.category].push(v.title);
      } else {
      	item[v.category].push(v.title);
      }
});

console.log(item);
for (var key in item) {
    var obj = item[key];
    console.log(obj);
}
</script>