JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
</div>
JavaScript
// assume the data is json.feed.category
var data = [{
term: "Adbc"
}, {
term: "acc"
}, {
term: "Abcc"
}, {
term: "bc"
}, {
term: "Bbc"
}, {
term: "dbc"
}, {
term: "1bc"
}];
var cat = function(categories) {
var listspan = document.createElement('span');
listspan.id = 'listspan';
categories
// get the labels starting with "A" ONLY.
.filter(function(category) {
return category.term.toLowerCase().indexOf('a') === 0;
})
// not required
.sort(function(a, b) {
return +(a.term > b.term) || +(a.term === b.term) - 1;
})
// insert a tag to listspan, instead of using string, this way maybe more efficient.
.forEach(function(category) {
var a = document.createElement('a');
a.href = 'search/label/' + category.term;
a.innerText = category.term;
listspan.appendChild(a);
listspan.appendChild(document.createElement('br'));
});
// insert the list to DOM
document.getElementById('container').appendChild(listspan);
}
cat(data);