How do you make a div “tabbable”?

Question

I have buttons that are div elements and I want to make them so that it is possible for the user to press the tab key on their keyboard and move between them. I\'ve tried wr

Answer 1

for those interested, in addition to the accepted answer, you can add the following jquery to make the div style change when you tab to it, and also handle Enter and Space to trigger a click (then your click handler will do the rest)

$(document).on('focus', '.button',function(){
    $(this).css('border','1px dotted black')
});
$(document).on('keyup', '.button',function(e){
    if(e.which==13 || e.which==32)
        $(this).click()
});

I'm sure someone has made this into a jq plugin $().makeTabStop