Question

Trying to reinvent a wheel with a archive list, got this so far

jsfiddle link to source code

what i’am trying to do:

when u press arrow button, it hide a logical element next to it.

1) arrow left to year must hide everying inside this year (except number of year)
2) arrow next to month must hide everything in this month (except number of month)
3) if i create more years – they must not interfere

possible solution would be something like .next().next() or next(2) to jump over the next element.. but that’s not working in jquery!

Answer 1

Another solution is to jump up to the .parent() and then hiding/showing the list .next() to it. Like so:

$(document).ready(function() {


    $('.toggle-year,.toggle-month').toggle(
        function() {
            $(this).html('▼');
            $(this).parent().next().hide();

        },

        function() {
            $(this).html('►');
            $(this).parent().next().show();

        }
    );
});

Check this fiddle to see if this is the behavior you want: http://jsfiddle.net/LV6VK/