jQuery选择同一父级中具有特定类的另一个元素

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.

Answer 1

Because there is no 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>