How do i make a tag show something only if i click something on another tag?

I’m trying to show content in a <select> tag but only if i select a specific thing on another <select> tag; for example: if i select the Renault brand, i want my “car models” <select> to return only Renault models.

This function shows car brands, and its linked to a select tag in html:

function loadBrand() {
    let carBrand = document.getElementById('brand');
    brands.forEach(function(brandName) {
        let opt = document.createElement('option');
        opt.value = brandName;
        opt.innerHTML = brandName;
        carBrand.appendChild(opt);
    });
}

I want to make a function called loadModels() that shows only the models of cars within a specific brand, as shown below:

const brandModels = {
    renault: [ 'Clio', 'Kwid', 'Sandero', 'Logan', 'Oroch', 'Duster' ],
    fiat: [ 'Argo', 'Uno', 'Mobi', 'Cronos', 'Palio', 'Toro', ],
    honda: [ 'Civic', 'Fit', 'City', 'HRV', 'Accord', 'CRV' ],
    peugeot: [ '2008', '208', '3008', '5008', 'Expert', 'Boxer' ],
    chevrolet: [ 'Onix', 'S10', 'Vectra', 'Cobalt', 'Tracker', 'Cruze' ],
    volkswagen: [ 'Gol', 'Polo', 'Saveiro', 'Virtus', 'Nivus', 'Amarok' ],
    hyundai: [ 'HB20', 'Creta', 'Tucson', 'Sonata', 'Santa Fé', 'IX35' ],
    nissan: [ 'March', 'Kicks', 'Leaf', 'Sentra', 'Versa', 'Frontier' ],
    toyota: [ 'Corolla', 'Yaris', 'SW4', 'Hilux', 'Etios', 'Prius' ],
}
const brands = [ 'Renault', 'Fiat', 'Honda', 
                'Peugeot', 'Chevrolet', 'Hyundai', 
                'Volkswagen', 'Nissan', 'Toyota' ];

Thanks in advance!