How do you "check" a radio button on "Tab" press using jQuery?

I am building a form with jQuery only, for a company where most of the employees conduct their daily work without ever using their mouse. So, I need to make this form where they can just tab to each radio group and it will automatically "check" the 1st radio button, and if they want to change it, they can just press the "arrow" key and it will change focus.

"Checking" the radio buttons using the "arrow" keys, are already integrated, but before it "checks" the 1st radio button, you have to click the "arrow" key and it will "check" the 2nd radio button, so you have to click "arrow left" to go back and "check" the 1st radio button.

How do you "check" the 1st radio button in a group on "tab"?

A simple example is:

<label>1st Radio</label>
<input type="radio" name="radio-group" id="radio-1" value="1">
<label>2nd Radio</label>
<input type="radio" name="radio-group" id="radio-2" value="2">

When pressing "Tab" once, I need it to automatically check the 1st radio button

Solution

You can do it like following.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>1st Radio</label>
<input type="radio" name="radio-group" id="radio-1" value="1">
<label>2nd Radio</label>
<input type="radio" name="radio-group" id="radio-2" value="2">

<script>
    $(document).keyup(function (e) {
        if (e.keyCode == 9) {
            $('#radio-1').prop('checked', true)
        }
    });
</script>