Question

I don’t think my question is difficult but I’m just a newbie in jQuery and this forum so hope that you can help me with this problem. I just want to open seperately the content of two divs by two button with the same class name and for easier to understand I will show my code snippet first:

<div id="CNN">
    <div id="article1">
        <div class="content">
            My content of CNN goes here
        </div>

        <div class="more">
            My button goes here     
        </div>
    </div>
</div>

<div id="Bloomberg">
    <div id="article1">
        <div class="content">
            My content of bloomberg goes here
        </div>

        <div class="more">
            My button goes here     
        </div>
    </div>
</div>

And here is my current jQuery code which is not working:

$(document).ready(function() {
    $("div.more").each(function() {
        $(this).click(function() {
            var target = $(this).parent().next(".content");
            $(target).slideDown("slow");
        });
    });
});

Here I want to click more button and it will show only the content belongs to it. You are free not to follow my current code :). So that’s all of my question, hope you all can help me to improve my programming skill and thanks you so much in advanced!

Answer 1

$(document).ready(function() {
    $("div.more").click(function(){
        $(this).parent().find("div.content").slideDown("slow");
    });
});

Should do the trick