Take data-value that is generated dynamically

Question

I need to take the value of a data-attr that is generated from an ajax request.

The most I got was:

$('.dataImposto').on('click', '.ImpostodeRenda', function(){
    $(".ImpostodeRenda").html("ooi");
});

The problem is that this "Impostoderenda" is generated dynamically from an ajax return.

Return of the Ajax

dados = $.parseJSON(data);
$.each(dados,function (key) {
    $(".dataImposto").append(" <div class='row static-info align-reverse'> <div class='col-md-8 name '>"+dados[key].nome+" ("+dados[key].valor+"%)</div> <div i class='col-md-3 value  imposto "+dados[key].nome.replace( /\s/g, '' ) + "' data-class="+dados[key].nome.replace( /\s/g, '' )+" data-imposto="+dados[key].valor+" > </div> </div>");
});

Example of generated HTML

<div class="dataImposto">
  <div class="row static-info align-reverse">
    <div class="col-md-8 name "> DAS(11.50 % )
    </div>
    <div id="imposto" class="col-md-3 value DAS" data-class="DAS" data-imposto="11.50"> </div>
  </div>
  <div class="row static-info align-reverse">
    <div class="col-md-8 name ">Imposto de Renda (15.00%)</div>
    <div id="imposto" class="col-md-3 value ImpostodeRenda" data-class="ImpostodeRenda" data-imposto="15.00">
      </div>
  </div>
</div>

Look who’s born DAS...

I wanted to take the data-class and the tax date of both.

Thank you in advance

Answer 1

That’s pretty simple, you use the document to refer since the DOM has already been loaded.

$('#gerar').on('click', function(){
    $('body').append('<button class="classeQueTereiEmTodos" data-value="OI">Get</button>')
})

$(document).on('click', '.classeQueTereiEmTodos', function(){
   var valor = $(this).attr('data-value')
   
   alert(valor)
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="gerar">Gerar attr</button>