Anexar evento a conteúdo dinamico.

Demonstração a anexar evento a conteúdo inserido no DOM via jQuery onde o bind acontece após o conteúdo estar inserido.

by Salustiano Silva

HTML

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<h5>
    Evento de click na TD anexado a '#tblPesquisa' após conteúdo inserido no DOM:
    <br/>
    <small>Ver <a href="http://jsfiddle.net/zuul/2PNU2/">este JSFiddle</a> para o inverso!</small>
</h5>
<div id="isto">
    <div id="pode">
        <div id="funcionar">
        </div>
    </div>
</div>

CSS

#tblPesquisa a{
    text-decoration:none;
}

JavaScript

var str = '<div class="container col-xs-4  table-overflow" id="tabela">';
str+= '<table class="table table-striped table-ordered table-bordered" id="tblPesquisa">';
str+= '<thead>';
str+= '<tr>';
str+= '<td><strong>CNPJ</strong></td>';
str+= '<td><strong>Razão Social</strong></td>';
str+= '</tr>';
str+= '</thead>';
str+= '<tbody>';
str+= '<tr>';
str+= '<td><label><a href="#" title="">Funcionou @pnet ?</a></label></td>';
str+= '<td><label><a href="#" title="">Funcionou @pnet ?</a></label></td>';
str+= '</tr>';
str+= '</tbody>';
str+= '</table>';

$('#funcionar').html(str);


// anexar evento
$('#tblPesquisa').on('click', 'td', function (e) {
    var ancora = $(this).find('label a');
    var valor = ancora.text();
    alert(valor);
});