How to target class name by class inside another class

Question

I have divs like this.

<div class"parent">
    <div class"child">
     Some Stuff Here
    </div>
</div>


<div class"parent">
    <div class"child">
     Some other kinda Stuff Here
    </div>
</div>

I want to click on the parent class and show the child class only inside this parent, without showing other classes of children in other parent classes.

$(document).on('click', '.parent', function(){
    $(this).find($('.child').show(500));
});

Answer 1

Pass the selector string to a find()non-object - you are passing a jQuery object. You also have invalid HTML because it class"parent"should be class="parent".

Demo

$(document).on('click', '.parent', function(){
    $(this).find('.child').show(500);
});

Answer 2

, , = class . :

<div class="parent">
    <div class="child" >
     Some Stuff Here
    </div>
</div>

:

$(document).on('click', '.parent', function(){
    $(this).children('.child').show(500);
});

Answer 3

Do not use the selector $('.child')in the search, as it will return the entire child in the DOM and find $(this).find($('.child').show(500));should be$(this).find('.child').show(500);

Also fix html class"parent"should be class="parent", the same applies toclass"child"

Live demo

$(document).on('click', '.parent', function(){
    $(this).find('.child').show(500);
});

Answer 4

You need to adjust the HTML as

<div class="child">

'=' is missing in your markup

The following line is enough:

$(document).on('click', '.parent', function(){
   $(this).find('.child').show(500);
});