JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="list"></ul>

JavaScript

var buttons = [{
    "tag": "adr",
    "color": "#123456"
}, {
    "tag": "ag",
    "color": "#123456"
}, {
    "tag": "fax",
    "color": "#123456"
}, {
    "tag": "ind",
    "color": "#123456"
}, {
    "tag": "sname",
    "color": "#123456"
}, {
    "tag": "per",
    "color": "#123456"
}, {
    "tag": "tel",
    "color": "#123456"
}, {
    "tag": "url",
    "color": "#123456"
}, {
    "tag": "url",
    "color": "#123456"
}, {
    "tag": "weblink",
    "color": "#123456"
}, {
    "tag": "weblink",
    "color": "#123456"
}, {
    "tag": "close",
    "color": "#123456"
}];

var buttonsP = $.grep(buttons, function (obj, i) {
    var m = buttons.filter(function (v) {
        return v.tag === obj.tag;
    })[0];
    return $.inArray(m, buttons) === i;
});
console.log(buttonsP)
for (var i = 0; i < buttonsP.length; i++) {
    $(".list").append("<li>" + buttonsP[i].tag + ", " + buttonsP[i].color + "</li>");
}