Question

Im using the following code

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
//Document ready
$(document).ready(function(){   

    //Show info
    $('a.getinfo').live("click", function(event){
        event.preventDefault();
                $(this).css("display","none");
                $(this).next('.info').css("display","block");
        }
    );
    $('a.getback').live("click", function(event){
        event.preventDefault();
                $(this).css("display","none");
                $(this).prev('a.getinfo').css("display","block");
        }
    );



});
</script>
<style>
.info {
    display: none   
}
</style>
<ul>
    <li>
        <a href="#" class="getinfo">
            <img src="http://s13.postimage.org/7xkjh8991/image.jpg">
            <span class="sticker opacity">get info</span>
        </a>
        <div class="info">
        <a href="#" class="getback">
            some info
            <span class="sticker-back opacity">back</span>
        </a>
        </div>
    </li>
    <li>
        <a href="#" class="getinfo">
            <img src="http://s13.postimage.org/7xkjh8991/image.jpg">
            <span class="sticker opacity">get info</span>
        </a>
        <div class="info">
        <a href="#" class="getback">
            some info
            <span class="sticker-back opacity">back</span>
        </a>
        </div>
    </li>
    <li>
        <a href="#" class="getinfo">
            <img src="http://s13.postimage.org/7xkjh8991/image.jpg">
            <span class="sticker opacity">get info</span>
        </a>
        <div class="info">
        <a href="#" class="getback">
            some info
            <span class="sticker-back opacity">back</span>
        </a>
        </div>
    </li>
</ul>

What it should do:

• When you click on the image, image ll hide and ll display text ‘some info back’.
• Now when i click on text ‘some info back’, i should get previous image

Problem:

• I can’t get to display image. Probably i dont know how to proper select class ‘.getinfo’

Answer 1

You are not doing the right selects. Here is a modified version of your code that works right: http://jsfiddle.net/ertaD/4/

I’ve modified the select to get the closest li and inthat li i’ve found the element needed.
You were hiding .getback, and showing back .info (the content of info remained hidden)

Here is the code:

$('a.getinfo').live("click", function(event){
    event.preventDefault();
            $(this).css("display","none");
            $(this).closest('li').find('.info').css("display","block");
    }
);
$('a.getback').live("click", function(event){
    event.preventDefault();
            $(this).parent().css("display","none");       
            $(this).closest('li').find('.getinfo').css("display","block");
    }
);