Question

HTML:

<div class="article">
<div class="article-content">
    <p><a href="javascript:;">Flygor</a> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam et est sit amet eros inter dum auctor vel semper quam. Vivamus non purus amet.</p>
    <div class="wrap btn-actions">
        <div class="col"><a href="#" class="bt bt-medium" title="Retweet this" target="_blank">REPLY</a>
            <a href="javascript:;" class="bt bt-large retweet">RETWEET</a><a href="javascript:;" class="bt bt-icon">
        </div>
    </div>
</div>

I have this Javascript:

    $('.retweet').click(function() {
    var retweetText =  $(this).('.article-content p').text();
});

So i want the p tag in the DIV.article-content, but just in this one. I have about 10 article-contents on the page, and when the person clicks DIV.retweet i want to pull just the p tag in just that one DIV.

Answer 1

Your Javascript is really close, actually. You need to use .parents() because .article-content is multiple parents above .retweet, then go down to the child, p.

EDIT:

As @ShaneBlake points out, .closest() is better suited for this situation. .closest() only grabs the first .article-content it traversed, while .parents() would grab them all. Therefore, the code is now.

$('.retweet').click(function() {
   $(this).closest('.article-content').children('p').text();
});