如何使用JQuery选择容器元素内的第一个div元素？

Question

I am pretty new in JQuery and I have the following situation:

<!-- Bottone relativo ai progetti WIFI: -->
<a title="WIFI" href="javascript: void(0)" id="showWifi_${item.index}" class="showWifi">
    <div class="news_box news_box_01 hvr-underline-from-center " style="margin-right: 50px;"></div>
</a>

I have the a tag having class="showWifi" .

I have to use JQuery to select the first div element inside this a tag having class="showWifi" .

I don't want set an id to this tag, but I want use the JQuery syntax to select the first div tag

How can I do this?

Answer 1

You can use first()

$('a.showWifi div').first().addClass('something')

You can also use :first pseudo-selector

$('a.showWifi div:first').addClass('something')

Note: first() is faster than :first (Thanks to @Zeratops). See: jQuery :first vs. .first()

Answer 2

You can use :first

Selects the first matched element.

$('a.showWifi > div:first')

Answer 3

Use .first()

$(".showWifi").find("div").first();

Working JSFIDDLE: http://jsfiddle.net/uamkvdkr/