javascript - 隐藏图片并显示iframe，但在一个div中包含多个类别

Question

有一个问题，是否可以隐藏图像并显示div内的iframe，但是仅在此div中应用这些更改，就可以有多个div具有相同的类，例如:

<div class="youtube_thumb">
    <img src="http://img.youtube.com/vi/R7JRGQ-UXBU/0.jpg" style="width:325px;border:0;" />
    <iframe width="325" height="250" src="http://www.youtube.com/embed/R7JRGQ-UXBU" frameborder="0" allowfullscreen></iframe>
</div>
<div class="youtube_thumb">
    <img src="http://img.youtube.com/vi/I0RBPgVBTKA/0.jpg" style="width:325px;border:0;" />
    <iframe width="325" height="250" src="http://www.youtube.com/embed/I0RBPgVBTKA" frameborder="0" allowfullscreen></iframe>
</div>

和风格:

.youtube_thumb iframe { display:none; }

我想要的只是当我单击图像时，是隐藏该图像并显示iframe，但仅针对一个div，因为您可以看到有多个具有相同类的div，是否可以使用javascript或jquery？

谢谢大家的帮助!

Answer 1

快速而肮脏地使用jQuery:

$('.youtube_thumb > img').click(function(){
    var $img = $(this);
    $img.hide();
    $img.next().show();
});