Not able to bind event on a new created element
<p>here i am not able to bind the click event on my newly created html as    #topics-lists
my all other code is working properly except that this newly created element
this is my all js file i m using jquery 1.6 version</p>

<pre><code>$('document').ready(function()
{

var val1;
var val2; 

$('#class-lists').find('a').click(function()
{
    val1=$(this).attr('data-class');
    $('#Varclass').attr('value',val1);
});

$('#subject-lists').find('a').click(function()
{
    val2=$(this).attr('data-subject');
    $('#Varsubject').attr('value',val2);
    $.getJSON('http://localhost:8080/data/values/lists?standard='+val1+'&amp;subject='+val2,function(data)
    {
          if(data.result=="Success")
          {
            var aa=[];
            $.each(data.topics,function(key,val){
              console.log(val);
                aa.push('&lt;div class="ui-block-b" &gt;&lt;a data-topic="'+val+'" href="#subtopics" data-transition="slide"&gt;&lt;div class="block-c"&gt;'+val+'&lt;/div&gt;&lt;/a&gt;&lt;/div&gt;');

            });
            $('#topics-lists').html(aa.join(''));

          }

    });
});

$('#topics-lists').find('a').bind('click',function(){alert('hi');});


});
</code></pre>

<p>please help me to find way out of it
Thanks for your precious time</p>
