JSFiddle - React, Tailwind, and code Playground

HTML

<select id="products">
  <option data-suppliers="1" value="apple">Apple</option>
  <option data-suppliers="1,3" value="olive">Olive</option>
  <option data-suppliers="1,2,5" value="lemon">Lemon</option>
  <option data-suppliers="4,6" value="tea">Tea</option>
  <select>

    <select id="suppliers">
      <option value="1">Firm-A</option>
      <option value="2">Firm-B</option>
      <option value="3">Firm-C</option>
      <option value="4">Firm-D</option>
      <option value="5">Firm-E</option>
      <option value="6">Firm-F</option>
      <select>

JavaScript

$('#suppliers').first().hide();

$("#products").change(function() {
if ($(this).data('options') === undefined) {
  $(this).data('options', $('#suppliers option').clone());
  $('#suppliers').first().show();
}
var ids = $(this).find(":selected").data('suppliers');
console.log(ids);

var options = $(this).data('options').filter('[value*=' + ids + ']');
$('#suppliers').html(options);
});