JSFiddle - React, Tailwind, and code Playground

HTML

<a href="#one">One</a>
<div class="appendable"></div>
<div class="base" id="one"></div>

CSS

.drag{
     width:200px;
     height:50px;
     background-color:red;
    margin-bottom:5px;
}

.toggle{
    opacity: 1;
}

.nav{
    position: absolute;
    z-index: 4000000;
}

.base{
display: none;
}

JavaScript

$(".base").each(function() {
    var elements = "#" + $(this).attr("id");
    var storage = localStorage.getItem(elements);
    console.log(storage);
    if (storage === null) {
        return;
    } else {

        var all = storage.match(/\w+|\d/g);
        $("#" + all[0]).clone().attr("class", "drag").attr("id", all[0] + all[1]).appendTo("body");


    }
});


$("a").click(function() {

    var target = $(this).attr("href");
    var id = $(target).attr("id");

    var click = $(target).data("clicked") || 1;
    $(target).data("clicked", ++click);
    var name = id + click;

    $(target).clone().attr("id", name).attr("class", "drag " + id).appendTo(".appendable");

    console.log(target + "-" + click);

    localStorage.setItem(target, target + "-" + click);

});