$('.ability').click(function (event) {
    $('.key-active').removeClass('key-active');
    $('.selected').removeClass('selected');

    $(this).find('.ability-key').addClass('key-active');
    $(this).find('img').addClass('selected');

    $('.box-text').text($(this).attr('text'));
    $('.ability-title').text($('.'+key).attr('title'));
});

$(document).keypress( function(event) {
    switch(event.which) {
        case 113:
            select('q');
            break;
        case 119:
            select('w');
            break;
        case 101:
            select('e');
            break;
        case 114:
            select('r');
            break;
        case 116:
            select('t');
            break;
    }
});

function select(key)
{
    $('.key-active').removeClass('key-active');
    $('.selected').removeClass('selected');

    $('.'+key).find('.ability-key').addClass('key-active');
    $('.'+key).find('img').addClass('selected');

    $('.box-text').text($('.'+key).attr('text'));
    $('.ability-title').text($('.'+key).attr('title'));
}