Jquery click event of accordion content

Question

Inside my accordion content i have rows of data that are loaded by ajax call. I want to capture click of each of these rows separately and get the id from clicked row. I am able to capture event of click of accordion content. but i am not able to get it separately for each row.

<dl id="accRegion">
<#list abc as xyz>          
<dt id="${xyz}"><a class="red">${xyz}</a></dt>
<dd id="${xyz}">
    <dl id="dateList" class="Heading">
    <#list somelist as element>
        <dt id="dateDiv"><a id="${element}" class="orange">${element}</a></dt>                  
    </#list>
    </dl>
</dd>
</#list>

this works

$("#accRegion dd").click(function(){});

but if i try something like below it doesnt work

$("#accRegion dd dt").click(function(){});

I am not sure whats wrong with this. Appreciate any pointers on this.

Answer 1

As rows are created dynamically, I guess that you should use this:

$("#accRegion dd dt").live('click', function() {
  // your code here
});

Answer 2

$(document).on('click',"#ur_id/class", function() {
  // your code here
});

Answer 3

You're closing your <dt> with a </div>