使用jQuery获取兄弟元素的内容

Question

我需要使用jquery获取某些特定元素的内容,问题是我在页面上重复了相同的元素:

<div class="content">
   <img alt="" src="">
   <p class="txt">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
   <p class="info">Lorem ipsum dolor...</p>
   <ul>
     <li><a class="uiButton">Test</a></li>
   </ul>
 </div>

所以,div.content在我的页面上重复多次,我想只得到点击按钮的div的内容.我在.uiButton上添加了一个onclick事件,并尝试使用parent(".txt")或兄弟(".txt"),但似乎没有工作......

$(".uiButton").click(function(){ 
  var txt = $(this).parent(".txt").text(); 
}

Answer 1

.txt不是父级,即使这样,它也必须是直接父级(如果匹配选择器,则匹配.parent()直接父级),而是需要:

$(".uiButton").click(function(){ 
  var txt = $(this).closest("ul").siblings(".txt").text(); 
});

另一种方法是一直到.content(通过.closest())是安全的,然后通过以下方式遍历.find():

$(".uiButton").click(function(){ 
  var txt = $(this).closest(".content").find(".txt").text(); 
});