JSFiddle - React, Tailwind, and code Playground

HTML

<select id="worker"></select>
<select id="fruits"></select>

JavaScript

var data = [ // The data
    ['Roy', [
        'Apples','Peaches'
    ]],
    ['John', [
        'Oranges', 'Pears', 'Peaches', 'Nuts'
    ]]
];

$a = $('#worker'); // The dropdowns
$b = $('#fruits');

for(var i = 0; i < data.length; i++) {
    var first = data[i][0];
    $a.append($("<option>"). // Add options
       attr("value",first).
       data("sel", i).
       text(first));
}

$a.change(function() {
    var index = $(this).children('option:selected').data('sel');
    var second = data[index][1]; // The second-choice data

    $b.html(''); // Clear existing options in second dropdown

    for(var j = 0; j < second.length; j++) {
        $b.append($("<option>"). // Add options
           attr("value",second[j]).
           data("sel", j).
           text(second[j]));
    }
}).change(); // Trigger once to add options at load of first choice