jQuery question / answer using fiddle ; triggering answer 'b' from an html element within answer 'a'

I haven't been able to figure this out despite hours of messing around, hopefully it's something that's been done many times before! On my test site (http://www.sketch360test.co.uk/giclee.php) I have a question / answer layout powered by jQuery, which I've got working to my liking in it's simple form. I need, however, to trigger some of the answer rows using elements that appear WITHIN OTHER answers. For example, if you select the first option "Giclee - the process", there are a few items there such as the "read the blurb" text which I need to toggle "the blurb" div answer row, and a "pick your paper" image button that needs to toggle the 'the papers' div answer row.

So in effect the 'pick your paper' image will do exactly the same job as the 'the papers' trigger button (it would be lovely if clicking the 'pick your paper' image could also trigger the background-image change on the 'the papers' button that exists in my existing jQuery, although I'm prepared for the fact that this might be a step too far!). My existing jQuery is below, as I said I开发者_JS百科've messed around adding various classes to the new trigger elements, but haven't been able to get the correct result - yet - without messing up the existing functionality. Any help would be greatly appreciated...

jQuery.fn.fadeToggle = function(speed, easing, callback) {
    return this.animate({opacity: 'toggle'}, speed, easing, callback);
};

$(function() {
    $("#answer .views-row").hide();
    $("#question .views-row").click(function(){
        var i = $(this).index();
        $("#answer .views-row").eq(i).toggle("slow").siblings().hide();
    $(".question").css("background-image", "url(/img/bg/nav-giclee.png)").eq(i).css("background-image", "url(/img/bg/nav-down.png)");
    });
});

---

I think this jsFiddle example (http://jsfiddle.net/alr3/LPNfZ/) I put together will answer your question. I didn't copy all of your mockup, and I used lists instead of divs, but this answer will do what you need, even using the "show and hide by using the corresponding index in the parent" methodology you are using.

However I would suggest using specific names for the "headers" and the "content"/answers, and then it would be really easy, you would just put a click event on whatever you wanted to be a link to show a different content like

$("#my-image-that-now-opens-an-answer-id").click(function() { $("some-specific-header-id").click(); });