JQuery Problem With attr()
<p>Here is a short snippet of HTML (it contains all relevant HTML and javascript code):</p>

<pre><code>&lt;script type="text/javascript"&gt;
    //&lt;![CDATA[
$(document).ready(function() {
    $('.remove-temporary-photo').click(function() {
        var url = '/my-account/remove-media/id/' + $(this).attr('id');
        $.get(url, function(data) {
            //
        });
        var id;
        id = $('ul.inl').attr('id');
        alert(id);
        //$.get('/my-account/temporary-album-photos/id/' + id, function(data) {
        //    $('#temporaryPhotos').html(data);
        //});
    });
});    //]]&gt;
&lt;/script&gt;
&lt;ul class="inl" id="4"&gt;
    &lt;li&gt;
        &lt;a href="#53" class="img"&gt;&lt;img src="/uploads/photos-thumbs/53.jpg" alt="Public Photo #53" /&gt;&lt;/a&gt;
        &lt;p class="options"&gt;
            &lt;input type="text" name="title53" id="53" value="Title..." class="title" style="width: 81px; margin-top: 5px; border: 0;" /&gt;
            &lt;a href="#53" class="blue remove-temporary-photo" id="53"&gt;remove&lt;/a&gt;
        &lt;/p&gt;
    &lt;/li&gt;

&lt;/ul&gt;
&lt;div class="clear"&gt;&amp;nbsp;&lt;/div&gt;
</code></pre>

<p>Notice this line:</p>

<pre><code>alert(id);
</code></pre>

<p>What I get is a blank popup window. Shouldn't id be equal to 4? I don't understand it. The reason why this matters is because I need the id for the next three/four lines of code that are commented now.</p>

<p>EDIT:</p>

<p>Now, I'm using valid ids but the alerts are still empty:</p>

<pre><code>&lt;script type="text/javascript"&gt;
    //&lt;![CDATA[
$(document).ready(function() {
    $('.remove-temporary-photo').click(function() {
        var id = $(this).attr('id');
        id = id.substr(2);
        alert(id);
        //var url = '/my-account/remove-media/id/' + id;
        //$.get(url, function(data) {
            //
        //});
        id = $('.inl:first').attr('id');
        id = id.substr(2);
        alert(id);
        //$.get('/my-account/temporary-album-photos/id/' + id, function(data) {
        //    $('#temporaryPhotos').html(data);
        //});
    });
});    //]]&gt;
&lt;/script&gt;
&lt;?php if (count($this-&gt;photos) &gt; 0): ?&gt;
&lt;ul class="inl" id="id&lt;?php echo $this-&gt;escape($this-&gt;a-&gt;id); ?&gt;"&gt;
&lt;?php foreach ($this-&gt;photos as $p): ?&gt;
    &lt;li&gt;
        &lt;a href="#id&lt;?php echo $this-&gt;escape($p-&gt;id); ?&gt;" class="img"&gt;&lt;img src="/&lt;?php echo $this-&gt;escape($p-&gt;thumb_path); ?&gt;" alt="&lt;?php echo $this-&gt;escape($p-&gt;title); ?&gt;" /&gt;&lt;/a&gt;
        &lt;p class="options"&gt;
            &lt;input type="text" name="title&lt;?php echo $this-&gt;escape($p-&gt;id); ?&gt;" id="id&lt;?php echo $this-&gt;escape($p-&gt;id); ?&gt;" value="Title..." class="title" style="width: 81px; margin-top: 5px; border: 0;" /&gt;
            &lt;a href="#id&lt;?php echo $this-&gt;escape($p-&gt;id); ?&gt;" class="blue remove-temporary-photo" id="&lt;?php echo $this-&gt;escape($p-&gt;id); ?&gt;"&gt;remove&lt;/a&gt;
        &lt;/p&gt;
    &lt;/li&gt;
&lt;?php endforeach; ?&gt;
&lt;/ul&gt;
&lt;div class="clear"&gt;&amp;nbsp;&lt;/div&gt;
&lt;?php endif; ?&gt;
</code></pre>
