Show hidden detail when clicking enter in footable

Question

I am trying to apply some simple functionality to a footable. I have a footable were you can tab through the rows. At each row I wish to be able to click enter to expand hidden content/details for the current selected row, but I am having some trouble locating the click function and adding keypress enter.

This is currently some jquery that i have added, but this won't work simply because the HTML is render from javascript, meaning that the hidden content is not render before i click on the row with the mouse:

$("tbody").delegate("*", "focus blur", function () {
    var elem = $(this);
    setTimeout(function () {
        elem.toggleClass("focused", elem.is(":focus"));
    }, 0);
});

$('.footable > tbody  > tr').keypress(function (e) {

    if ($(this).hasClass("focused") && e.which == '13') {
        //alert('test');
        $('.footable-row-detail').css({ "display": "table-row" });
    }

});

Answer 1

Found out what the problem was.

$table.find(opt.toggleSelector).unbind('keypress').keypress(function (e) {
            if ($(this).hasClass('focused') && e.which == 13) {
                //alert('You pressed enter!');
                $(this).trigger(trg.toggleRow);
            } 
        });