JSFiddle - React, Tailwind, and code Playground
HTML
<h1 id="title">Memory Leak Test</h1>
<div id="links"></div>
<div id="info"></div>
JavaScript
var myLinks;
myLinks = [];
myLinks.push({ 'name': 'Link 1', 'value': 'Uno' });
myLinks.push({ 'name': 'Link 2', 'value': 'Dos' });
myLinks.push({ 'name': 'Link 3', 'value': 'Tres' });
CreateLinks();
function CreateLinks() {
var ul = $("<ul></ul>").appendTo('div#links');
for (var i in myLinks) {
var li = $('<li>' + myLinks[i].name + '</li>').appendTo(ul);
(function (value) {
li.click(function (e) {
$('div#info').append('<label>' + value + '</label><br />');
RecreateLinks();
});
})(myLinks[i].value);
}
}
function RecreateLinks() {
$('div#links').children().remove();
CreateLinks();
}