views:

115

answers:

3

So, here's my situation. I have a wordpress site, and each entry has a link within the post div.

<div class="post" id="post-133"> 
<h2><a href="post-link" rel="bookmark" title="Link to Post">Post</a></h2> 
<div class="post-date"> 
<span class="date">Tuesday, Jan. 26, 2010</span><span class="right read"><a href="#" class="noprint show_single" id="133">Read More</a></span> 
</div>

I have the height applied to the css to only show a certain amount of each post. How can I get jQuery to target the parent element to add a class, showing the whole post? Here is what I have so far. Am I on the right path?

var $j = jQuery.noConflict();
var curr = (event.target).parent('div');
$j(function() {
  $j('a.show_single').click(function() {
 $j('curr').toggleClass('show');
 return false;
  });
});
A: 
 var $j = jQuery.noConflict();
 $j(function() {
     $j('a.show_single').click(function() {
        $j(this).parents('div.post').toggleClass('show');
        return false;
     });
 });
Per Holmäng
This won't do anything, since the `a` element's direct parent is a `span`.
SLaks
Yeah, I realized that, and edited.
Per Holmäng
A: 

Your question is unclear.

Assuming that you want to toggle the show class of the div.curr containing the a that was clicked on, you can call the closest method, like this:

$j(this).closest('div.curr').toggleClass('show');
SLaks
A: 

Inside the event function, you use the this keyword to get into the proper context, and then you traverse through the DOM to find what you are looking for:

var $j = jQuery.noConflict();
$j(function() {
    $j('a.show_single').click(function() {
        $j(this).parents('div.post').toggleClass('show');
        return false;
    });
});
Dominic Barnes
Nice! Thank you for your help!
werm