Changing an image's ALT value with jQuery
<p>I have a modal form that changes the caption of a photo (paragraph under the image) and I am also trying to change the image's ALT attribute but cannot seem to.</p>

<p>Here is the jQuery I am trying to make work</p>

<pre><code>$(".edit").click(function() {
                var parent = $(this).parents('.item');
                var caption = $(parent).find('.labelCaption').html();
                $("#photoCaption").val(caption);
                $("#editCaptionDialog").dialog({
                        width: 450,
                        bgiframe: true,
                        resizable: false,
                        modal: true,
                        title: 'Edit Caption',
                        overlay: {
                            backgroundColor: '#000',
                            opacity: 0.5
                        },
                        buttons: {
                            'Edit': function() {
                                var newCaption = $("#photoCaption").val();
                                $(parent).find(".labelCaption").html(newCaption);
                                $(parent).find('img').attr('alt', newCaption);
                            }
                        }
                });
                return false;
            });
</code></pre>

<p>And the HTML</p>

<pre><code>&lt;li class="item ui-corner-all" id="photo&lt;? echo $images['id'];?&gt;"&gt;
                        &lt;div&gt;
                            &lt;a href="http://tapp-essexvfd.org/gallery/photos/&lt;?php echo $images['filename'];?&gt;.jpg" class="lightbox" title="&lt;?php echo $images['caption'];?&gt;"&gt;
                            &lt;img src="http://tapp-essexvfd.org/gallery/photos/thumbs/&lt;?php echo $images['filename'];?&gt;.jpg" alt="&lt;?php echo $images['caption'];?&gt;" class="photo ui-corner-all"/&gt;&lt;/a&gt;&lt;br/&gt;
                            &lt;p&gt;&lt;span class="labelCaption"&gt;&lt;?php echo $images['caption'];?&gt; &lt;/span&gt;&lt;/p&gt;
                            &lt;p&gt;&lt;a href="edit_photo.php?filename=&lt;?php echo $images['filename'];?&gt;" class="button2 edit ui-state-default ui-corner-all"&gt;Edit&lt;/a&gt;&lt;/p&gt;
                        &lt;/div&gt;
                    &lt;/li&gt;
</code></pre>

<p>The caption is changing like it should.</p>

<p>Thanks</p>

<p><strong>UPDATE</strong></p>

<p>Here is the code for editCaption</p>

<pre><code>&lt;div id="editCaptionDialog" style="display: none;"&gt;
                        &lt;p&gt;&lt;strong&gt;Caption:&lt;/strong&gt; &lt;input type="text" name="photoCaption" id="photoCaption"/&gt;&lt;/p&gt;
                &lt;/div&gt;
</code></pre>
