//
//  JavaScript for Races
//

$(document).ready(function() {
    //hide detailed event info on pageload
    $('.race-description').hide();
    $('#raceDetails').show();

    $('.race').hover(function(event) {    
        //Associate the clicked Event's ID with the data box and display
        var id = $(this).attr('id') + '-description';             
        $('#' + id).fadeIn('fast');

        //Display title of race in heading
        var titleId = $(this).attr('id') + '-title';
        var titleContent = $('#' + titleId).text();
        $('#raceDetailsTitle').html(titleContent);
        
        //hide any other open events
        //(e.g. only display one event details at a time)
        $('#' + id).siblings('div:visible').toggle();        
    }, function() {});    //empty function as hover function takes two arguments
});