如何选择放置在带有appendChild的跨度内的img?

我正在使用picturefill.js(Scott Jehl): https://github.com/scottjehl/picturefill/blob/master/picturefill.js

以下是我如何设置它的,(一些代码省略了b/c,这只是更多的媒体查询内容)使用span标签和数据属性,如他的文档中所示:

<figure>
    <a href='http://www.casaromeromexican.com'>
        <span id="picture" data-picture data-alt="Casa Romero Mexican website">
        <span data-src="img/casa-romero-mexican.jpg"></span>
        <span data-src="img/casa-romero-mexican@2x.jpg" data-media="(min-device-pixel-ratio: 2.0)"></span>
        <span data-src="img/casa-romero-mexican-md.jpg" data-media="(min-width: 768px") </span> 
// and so on...

正如预期的那样,正在加载正确的img并将其放置在页面上。以下是生成的HTML的一个片段:

<span data-src="img/casa-romero-mexican-md.jpg" data-media="(min-width: 768px)"><img alt="Casa Romero Mexican website" src="img/casa-romero-mexican-md.jpg"></span>

我想做的是向最终生成的img标记添加一个类。

然而,我甚至无法选择附加的img!以下是我正在使用的内容:

alert(($('#picture').children().find('img').size()));

即使图像在页面上,也会返回0。我预计它会根据媒体查询返回1,b/c的大小,其中1张图像会用picturefill附加到页面上。

为了确保DOM加载没有问题,我在页眉中放置了picturefill.js(尽管js大部分时间都应该放在页脚中),甚至这样做了:

$(document).ready(function() {
        alert('ready!');
        alert(($('#picture').children().find('img').size()));
        });

似乎仍然找不到img。