Estou tentando criar uma "tabela" com divs com dados recuperados do localStorage dinamicamente.
Consigo recuperar os dados e criar os elementos, porém não da maneira desejada. Os dados estão sendo duplicados dentro da div(que de fato era a unica que deveria repetir).
Meu objetivo é criar uma estrutura assim para cada objeto recuperado do localStorage:
ESTRUTURA ESPERADA PARA CADA OBJETO:
<div class="row align-items-center w-100" id="cadastroCliente">
<div> <!--DIV QUE TEM QUE REPETIR PARA CADA OBJETO-->
<div class="col-lg-3">
<div class="col">Nome</div>
<div class="col">Email</div>
</div>
<div class="col-lg-3">
<div class="col" style=>CPF</div>
<div class="col" style=>TEL</div>
</div>
<div class="col-lg-3">
<div class="col">Status</div>
</div>
<div class="col-lg-3">
<button type="button" class="btnCustom float-r mr-3">Editar</button>
</div>
</div>
</div>
Estou tentando criar da seguinte forma:
no HTML:
<div class="row" id="listaClientes"></div>
JS:
//FUNCTION PARA CRIAR A DIV DE FORMA DINAMICA
function listaCliente(clientes = Array(), filter = false) {
if(clientes.length == 0 && filter == false) {
clientes = bd.recuperarClientes()
}
let listaCliente = document.getElementById('listaClientes')
clientes.forEach(function(d) {
$('#listaClientes').append(`<div class="col-lg-3 divCustom"></div>`);
Estou conseguindo criar a div que quero que repita para cada Objeto, mas não estou sabendo como inserir dados dinamicos dentro dessa div.