$(document).ready(function() {

    // loop through all hyperlinks within the FAQ div
    // bind event for each

    $(".faq a").map(function(index, el) {
        $(el).click(function() {
            toggleFAQ('answer' + index);
        });
    });

    $(".technical-help .trig").map(function(index, el) {
        $(el).click(function() {
            toggleHelp('boxbody' + index);
        });
    });

    // left nav roll over events for 'apply for an account'

    $('.applyAcount').mouseover(function() {
        this.src = 'images/button-apply4account-over.gif';
    });

    $('.applyAcount').mouseout(function() {
        this.src = 'images/button-Apply4Account-navbar.gif';
    });

    // appy for an account page events for button

    $('.appFormLink').mouseover(function() {
        this.src = 'images/1button-Apply4Account-over.gif';
    });

    $('.appFormLink').mouseout(function() {
        this.src = 'images/button-Apply4Account.gif';
    });

}); 



// control the css 'display' setting  
// 1. hide the default text
// 2. show the corresponding answer for the selected question
// note: cms does not allow id's to be used within markup, hence using classes

function toggleFAQ(theStyle) {
    var myclass = new RegExp('\\b'+theStyle+'\\b');
    var elem = document.getElementsByTagName('*');
    var name;
    
    for (var i = 0; i < elem.length; i++) {
        name = elem[i].className;
        
        // hide default text
        if(name.search('answer') != -1) {
            if(name.search('answer-default') != -1) {
                elem[i].style.display = "none";
            }
            elem[i].style.display = "none";
        }            
        
        // show answer
        if (myclass.test(name)) {
            elem[i].style.display = "block";
        }  
    }        
}


function toggleHelp(theStyle) {
    var myclass = new RegExp('\\b'+theStyle+'\\b');
    var elem = document.getElementsByTagName('*');
    var name;
    
    for (var i = 0; i < elem.length; i++) {
        name = elem[i].className;
        
        // show help
        if (myclass.test(name)) {
            if(elem[i].style.display != "block") {
                elem[i].style.display = "block";
            }
            else {
                elem[i].style.display = "none";
            }
        }             
    }        
}