can't find elements after appending

can't find elements after appending

Can't seem to access elements after I've appended them, keep trying to get hyperlink id's but they seem to be undefined. Any idea how I can access these elements?
 
My first function loads an xml doc, then appends it to a ul.

Then, my second function is supposed to to get the id of the link the user clicked, then search the xml document for that node. Then only display that specific node.

 
If I add a simple onclick function to the hyperlinks in function one to tell me it's id, it says it's undefined.
I'm not sure how or why that is...help!

      1. $(

        function () {

        $(

        '#gallerylnk').click(function () {

        //$('#update-target ul li').remove(); // Remove outdated data

        $.ajax({

        // Now lets grab fresh XML data

        type:

        "GET",

        url:

        "labels.xml",

        dataType:

        "xml",

        success:

        function (xml) {

        $(xml).find(

        'label').each(function () {

        var id_link = $(this).attr('id')

        var added_text = $(this).attr('added')

        var name_text = $(this).find('name').text()

        var img_link = $(this).find('img').text()

        $(

        '<li class="arrow"></li>')

        .html(

        '<a id="' + id_link + '" onclick="GetGalleryItem()" href="#gallery-item" class="n"><img width="55px" height="55px" src="' + img_link + '" /><span style="position:relative;padding-left:24px;top:-28px;">' + name_text + '</span><br /><span style="font-size:.8em;font-size:.8em;position:relative;padding-left:80px;top:-26px;">Added: ' + added_text + '</span></a>')

        .appendTo(

        '#update-target');

        });

        //close each(

        }

        });

        //close $.ajax(

        });

        //close click(

        });

      2. // Function 2:

      3. $(

        function () {

        $(

        '#update-target li a').click(function () {

        $.ajax({

        // Now lets grab fresh XML data

        type:

        "GET",

        url:

        "labels.xml",

        dataType:

        "xml",

        success:

        function (xml) {

        $(xml).find(

        'label').each(function () {

        var id_link = $(this).attr('id')

        var added_text = $(this).attr('added')

        var name_text = $(this).find('name').text()

        var img_link = $(this).find('img').text()

        $(

        '<li class="arrow"></li>')

        .html(

        '<a id="' + id_link + '" onclick="GetGalleryItem()" href="#gallery-item" class="n"><img width="55px" height="55px" src="' + img_link + '" /><span style="position:relative;padding-left:24px;top:-28px;">' + name_text + '</span><br /><span style="font-size:.8em;font-size:.8em;position:relative;padding-left:80px;top:-26px;">Added: ' + added_text + '</span></a>')

        .appendTo(

        '#update-target-item');

        });

        //close each(

        }

        });

        //close $.ajax(

        });

        //close click(

        });

      4. // The html...

      5. <!-- Gallery List -->

        <div id="gallery">

        <div class="toolbar">

        <h1>Gallery</h1>

        <a class="button back" href="#">Back</a>

        </div>

        <ul id="update-target" class="rounded"></ul>

        </div>

        <!-- Selected Gallery Item -->

        <div id="gallery-item">

        <div class="toolbar">

        <h1>Date</h1>

        <a class="button back" href="#">Back</a>

        </div>

        <ul id="update-target-item" class="rounded"></ul>

        </div>