I have an array of several thousand objects with properties, something like this

var plants = [];
plants [0] = {name: "Abronia", foliagecolor: "Pink", reproduction: "seeds", price: 3, group: "hz1", lifeform: "Herbs", plantsize: 20, usable: "hz1", crownsize: 30};
plants [1] = {name: "Aster", foliagecolor: "Violet", reproduction: "seeds", price: 2, group: "hz2", lifeform: "Shrubs", plantsize: 22, usable: "hz2", crownsize: 20};
plants [2] = {name: "Basil", foliagecolor: "Green", reproduction: "seeds", price: 1, group: "hz3", lifeform: "Herbs", plantsize: 25, crownsize: 32};
plants [3] = {name: "Cornflower", foliagecolor: "Blue", reproduction: "stem", price: 13, group: "hz4", lifeform: "Herbs", plantsize: 15, crownsize: 27};

There are 15 filters with the "control" class, each of which is a property of an object. For example - one of them:

<div class = "filteritem">
<span> Life Form </span> <br>
<select id = "lifeform" class = "control" data-name = "lifeform">
<option> - not selected - </option>
<option> Trees </option>
<option> Shrubs </option>
<option> Herbs </option>
</select>
</div>

I am trying to set up filters but nothing works. Please help me in which direction to look:

var query = {};
    $(".control").change(function() {
        var meaning = $(this).attr("data-name");
        Object.defineProperty(query, meaning,  {value : $(this).val(), configurable: true}); 
        console.log(query);
        var result = plants.filter(function(item) {
            for (var key in query) {
                if (item[key] === undefined || item[key] != query[key])
                    return false;
            }
            return true;
        });
        console.log(result);
    });