How can I do sub selects on already selected element?

Question

Markup:

<div class="foo">
    <img src="loading.gif" class="loading" style="display: none;" />
</div>

Js:

$("div[class='foo']").click(function(e) {
    e.preventDefault();
    $(this).hide();
    $(/* somehow select the loading img of exactly this div with class foo (not others) */).show();
});

Answer 1

$("div[class='foo']").click(function(e) {
    e.preventDefault();
    $(this).hide();
    $('img.loading', this).show();
});

Answer 2

If you want any descendant of the given element you can use find() :

$(this).find(".foo");

If you know you only want to search for the first-level children elements, you can use children() :

$(this).children(".foo");

Answer 3

You could use

$(this).find("img").show();

or

$(this).find("img.loading").show();