jQuery find all elements with class beneath parent even in children elements

Question

Here is some sample HTML:

<div class="parent">
    <div class="searchEl"></div>
    <div class="searchEl"></div>
    <div class="child">
        <div class="searchEl"></div>
        <div class="searchEl"></div>
    </div>
</div>

And here is a jQuery function:

$(function(){
    $(".parent>.searchEl").each(function(){
        $(this).html("Found this one");
    });
});

The DOM elements will end up like so:

<div class="parent">
    <div class="searchEl">Found this one</div>
    <div class="searchEl">Found this one</div>
    <div class="child">
        <div class="searchEl"></div>
        <div class="searchEl"></div>
    </div>
</div>

Using jQuery/Javascript, how can I search for and find all the elements with class .searchEl beneath the element .parent, even if they are within another child element, without searching the document globally with $(".searchEl")?

Answer 1

Remove > from your select

$(".parent .searchEl").

You can use the .find() method also,

$(".parent").find(".searchEl")