Hide previously opened article on imagemap click?

Question

I was wondering if someone can help me out

http://jsfiddle.net/zjCzc/

I have this area map that I created over the United States and i wrote

$(document).ready(function() {
    $(".region-box").hide();$('#Map').children('area').click(function() {
        var regionArea = $(this).attr('href').toString();
        $('.region-box' + regionArea).toggle();
        return false;
    });
});

This allows the click to show up each article when clicked but is there any way that it can be setup to allow it to hide the one that was already open.

For example when you click in northeast and then click on Washington. Northeast will auto close?

Answer 1

Just add $('.region-box').hide(); to the beginning of the .click() callback:

$(document).ready(function () {
    $(".region-box").hide();
    $('#Map').children('area').click(function () {
        $('.region-box').hide();
        var regionArea = $(this).attr('href').toString();
        $('.region-box' + regionArea).toggle();
        return false;
    });
});

http://jsfiddle.net/zjCzc/1/