title: jQuery can't find nested image
body: <p>I have the following HTML:</p>
  
  <pre><code>&lt;div id="showDropZone" class="ui-droppable" style="position: absolute; z-index: 1; outline-style: none; left: 0px; width: 379px; height: 500px;"&gt;
      &lt;div id="introText" style="display: none;"&gt;Drag and drop program images here&lt;/div&gt;
          &lt;ul class="gallery ui-helper-reset"&gt;
              &lt;li class="imgThumbLi ui-draggable imageSelected" title="File Name: drago.jpg Dimension: 225x225 Size: 7 KB" style="display: list-item;"&gt;
                  &lt;img class="image" src="/myApp/2012/5/1/1335900424140/39345e7f3d12487bb6e347e786194c9b" title="File Name: drago.jpg Dimension: 225x225 Size: 7 KB"&gt;
                  &lt;div class="imageInfo"&gt;
                      &lt;p class="detailTitle"&gt;Logo!&lt;/p&gt;
                  &lt;/div&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>In my jQuery/JS function I obtain the <code>&lt;ul&gt;</code> element (and its <code>&lt;li&gt;</code> children) and I can easily find the <code>p.detailTitle</code>'s text value with the following code:</p>
  
  <pre><code>$("#showDropZone").find("ul").each(function() {
      $(this).find("li").each(function() {
          var detailTitle = $(this).find("p.detailTitle").text();
  
          // This prints "Logo!" correctly...
          alert(detailTitle);
  
          var imageTitle = $(this).find("img").title;
          var imageSrc = $(this).find("img").src;
  
          // But these both print "undefined"...
          alert(imageTitle);
          alert(imageSrc);
      }
  }
  </code></pre>
  
  <p>How do I get the <code>&lt;img&gt;</code>'s <code>title</code> and <code>src</code> attributes? As indicated in the code above, the current code returns them as <code>undefined</code>. Thanks in advance!</p>