JSFiddle - React, Tailwind, and code Playground

HTML

<select id="color" name="color">
    <option value="red">red</option>
    <option value="white">white</option>
</select>
<select id="size" name="size">
    <option value="S">S</option>
    <option value="M">M</option>
    <option value="XL">XL</option>
    <option value="XXL">XXL</option>
</select>
<select id="type" name="type">
    <option value="polo">polo</option>
    <option value="shirt">shirt</option>
</select>
<div id="price"></div>

JavaScript

var product = {
    101: { color: 'red', size: 'S', type: 'polo', price: '200' },
    102: { color: 'red', size: 'M', type: 'polo', price: '250' },
    103: { color: 'red', size: 'XL', type: 'polo', price: '300' },
    104: { color: 'red', size: 'XXL', type: 'polo', price: '350' },
    105: { color: 'white', size: 'S', type: 'polo', price: '200' },
    106: { color: 'white', size: 'M', type: 'polo', price: '250' },
    107: { color: 'white', size: 'XL', type: 'polo', price: '300' },
    108: { color: 'white', size: 'XXL', type: 'polo', price: '350' },
    109: { color: 'red', size: 'S', type: 'shirt', price: '50' },
    110: { color: 'red', size: 'M', type: 'shirt', price: '60' },
    111: { color: 'red', size: 'XL', type: 'shirt', price: '70' },
    112: { color: 'red', size: 'XXL', type: 'shirt', price: '80' },
    113: { color: 'white', size: 'S', type: 'shirt', price: '50' },
    114: { color: 'white', size: 'M', type: 'shirt', price: '60' },
    115: { color: 'white', size: 'XL', type: 'shirt', price: '70' },
    116: { color: 'white', size: 'XXL', type: 'shirt', price: '80' }
};

$('select').on('change', function(event){
    var color = $('#color').find(':selected').val();
    var size = $('#size').find(':selected').val();
    var type = $('#type').find(':selected').val();
    var price = $('#price');
    
    var result = [];
    $.each(product, function( index, value ) {
      	if(value.color == color && 
           value.size == size && 
           value.type == type) {
           		result = value;
        }
    });
    
    price.html(result.price);
    
    event.stopPropagation();
}).trigger('change');