$(document).ready(function () {
    function toggleAccordion(h3) {
        if ($(h3).is(".active")) {
            $(h3).toggleClass("active");
            $('.arrow.active').attr('src', chevronBaseUrl + 'images/arrow_accordionRight.gif'); // change the image src of the current ACTIVE image to have an INACTIVE state.
            $(h3).parent().next(".accordionContent").slideToggle();
            return false;
        } else {
            $(".accordionContent:visible").slideUp("slow"); // close all visible divs with the class of .content
            $("h3.active").removeClass("active");  // remove the class active from all h1's with the class of .active
            $(h3).toggleClass("active");
            $('.arrow.active').attr('src', chevronBaseUrl + 'images/arrow_accordionRight.gif'); // change the image src of the current ACTIVE image to have an INACTIVE state.
            $(".arrow").addClass('active');
            $(h3).siblings('.arrow.active').attr('src', chevronBaseUrl + 'images/arrow_accordionDown.gif'); // change the image src of the new active image to have an active state.
            $(h3).parent().next(".accordionContent").slideToggle();
            return false;
        }
    }

    $(".accordionContent").hide();

    $('<img src="' + chevronBaseUrl + 'images/arrow_accordionRight.gif" class="arrow" />').insertAfter('a h3');

    var h3ToggleElement = $("#accordion a h3");
    h3ToggleElement.parent().click(function () {
        if ($(this).is("a")) {
            var h3 = $(this).find("h3");
            toggleAccordion(h3);
        }
        return false;
    });

    // for initial state of h3 is active, trigger click event
    // (if there is more than one initial active state, the last one will be active)
    var initialActiveHeading = $("a h3.active");
    initialActiveHeading.removeClass("active");
    initialActiveHeading.trigger('click');

    //    $(".arrow").click(function() {

    //        var h3 = $(this).parent().find("h3");

    //        if ($(h3).is(".active")) {
    //            $(h3).toggleClass("active");
    //            $(this).attr('src', 'images/arrow_accordionRight.gif');
    //            $(h3).parent().next(".accordionContent").slideToggle();
    //            return false;
    //        } else {
    //            $(".accordionContent:visible").slideUp("slow"); // close all visible divs with the class of .content
    //            $("h3.active").removeClass("active");  // remove the class active from all h1's with the class of .active
    //            $(h3).toggleClass("active");
    //            $(this).attr('src', 'images/arrow_accordionRight.gif');
    //            $(this).addClass('active');
    //            $(h3).siblings('.arrow.active').attr('src', 'images/arrow_accordionDown.gif'); // change the image src of the new active image to have an active state.
    //            $(h3).parent().next(".accordionContent").slideToggle();
    //            return false;
    //        }

    //    });

});