Accessing DOM objects within Jquery jTemplate content

I have the following jTemplate:

{#foreach $T.d as post}
<li>
    <label for="ContactDetail">{$T.post.DetailType}</label>
    <input type="text" id="ContactDetail_{$T.post.ContactDetailId}" runat="server" class="w400" autocomplete="on" value='{$T.post.Detail}' />
    <div id="deletecontactdeet"><a href="#" id='{$T.post.ContactDetailId}' class='delete-deet'><img src="/images/iconography/tiny-delete.png" alt="Delete this entry" title="Delete this entry" border="0" /></a></div>
</li>
{#/for}

I am then following the call to this template attaching a .click to the a within the template:

var deetid;
            $('.delete-deet').click(function () {
                deetid = $(this).attr('id');
                alert(deetid);
                $('#delete-dialog').dialog('open');
                return false;
            });

The .click never fires however. I suspect it maybe because the DOM object is/has been created within the template - does anyone have any clues or suggestions as t开发者_高级运维o how to solve this?

Help, as always, is appreciated.

Try .live():

$('.delete-deet').live('click', function () {
    deetid = $(this).attr('id');
    alert(deetid);
    $('#delete-dialog').dialog('open');
    return false;
});