jQuery select another element with certain class in same parent

Question

let say i have this div

<div id='parent'>
  <button id='button'></button>
  <div id='child'>
     <div id='grandchild' class='lookAtMe'>
          Some JSON text
     </div>
  </div>
</div>

I wanted to give the #button an on click event that returned the text at #lookAtMe div, specific to the div whom it shares parent/grandparent (in this case, the #parent div)

I tried using:

 $("#button").on("click",function(){
     var ReturnedText = $(this).parent(".lookAtMe").text();
     console.log(RetrunedText);
 });

But the console log would retruned (empty string).

Where did i do wrong? please help. Thankyou very much.

The button doesn't have a parent with class lookAtMe, it has a div with id parent as it's parent. Try $(this).parent().find('.lookAtMe').text(); — Ryan Wilson
– Ryan Wilson, Commented Feb 7, 2018 at 16:42
You don't even need parent... $(this).next().find('.lookAtMe').text() — evolutionxbox
– evolutionxbox, Commented Feb 7, 2018 at 16:45

Suresh Atta · Accepted Answer · 2018-02-07 16:42:56Z

4

Because there is n o parent with that class. You need find().

Actually you need to write

 var ReturnedText = $(this).parent().find(".lookAtMe").text();

 $("#button").on("click",function(){
     var ReturnedText = $(this).parent().find(".lookAtMe").text();
     console.log(ReturnedText);
 });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='parent'>
  <button id='button'></button>
  <div id='child'>
     <div id='grandchild' class='lookAtMe'>
          Some JSON text
     </div>
  </div>
</div>

answered Feb 7, 2018 at 16:42

Suresh Atta

122k38 gold badges206 silver badges315 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Gita Prasetya Adiguna Over a year ago

Ah yes i see, seems like i have miss understanding. I tough the parent() arguments used to select something amon the parent's childern, so it actually used to specify the parents that we need to select. I see now. Thank you. I've tried the code and it worked very well.

Collectives™ on Stack Overflow

jQuery select another element with certain class in same parent

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related