JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="myList"></ul>

CSS

ul {
    margin-left: 0;
    padding: 0;
}

li {
    display: block;
    background-color: #259b24;
    color: #fff;
    cursor: pointer;
    padding: 20px;
    font-size: 18px;
    border: solid 1px #209a20;
    transition: background 0.3s ease;
}

li:hover {
    background-color: #8bc34a;    
}

JavaScript

var myList = document.getElementById('myList');
var items = [{id: 1, name: 'первый'}, {id: 2, name: 'второй'}, {id: 3, name: 'третий'}];
items.map(function (item) {
    var itemElement = document.createElement('li');
    itemElement.appendChild(document.createTextNode(item.name));
    itemElement.objectId = item.id; // присваиваем свойство objectId для каждого itemElement
    itemElement.onclick = function () {
        alert('item #' + this.objectId);
    };
    myList.appendChild(itemElement);
});