CODEWITHSUNDEEP
javascriptjqueryhtmljquery-selectors
Gita Prasetya Adiguna
Gita Prasetya Adiguna

Reputation: 389

jQuery select another element with certain class in same parent

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.

Upvotes: 2

Views: 1701

Answers (1)

Suresh Atta
Suresh Atta

Reputation: 121998

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>

Upvotes: 4

Related Questions