I am getting stuck on this. I want to make query string on dyanmic filters. Right now i have added to types of filter `Select your favorite sports` and `Select your favorite food:` .. So in future it will be more filters and it will be in check boxes type and selectbox only. So i want to make it fully dynamic. Here is my html code:-

```
<body>
    <select class="getfilterchange" name="hobby">
        <option value="">Select</option>
        <option value="Chess">Chess</option>
         <option value="Hockey">Hockey</option>
    </select>
    <h3>Select your favorite sports:</h3>
    <label><input class="getfilter" type="checkbox" value="football" name="sport"> Football</label>
    <label><input class="getfilter" type="checkbox" value="baseball" name="sport"> Baseball</label>
    <label><input class="getfilter" type="checkbox" value="cricket" name="sport"> Cricket</label>
    <label><input class="getfilter" type="checkbox" value="boxing" name="sport"> Boxing</label>
    <label><input class="getfilter" type="checkbox" value="racing" name="sport"> Racing</label>
    <label><input class="getfilter" type="checkbox" value="swimming" name="sport"> Swimming</label>
    <br>
    <h3>Select your favorite food:</h3>
    <label><input class="getfilter" type="checkbox" value="choclate" name="food"> Choclate</label>
    <label><input class="getfilter" type="checkbox" value="biscuits" name="food"> Biscuits</label>
    <label><input class="getfilter" type="checkbox" value="candy" name="food"> Candy</label>
    <label><input class="getfilter" type="checkbox" value="Cake" name="food"> Cake</label>
    <br>
</body>

```

Here i have some try to jquery code :-

```
<script type="text/javascript">
$(document).ready(function() {
    var names = [];
    $(".getfilter").click(function(){
        if(jQuery.inArray($(this).attr('name'), names )=='-1'){
            names.push($(this).attr('name')); 
        }
        var favorite = [];
        $.each($("input[name='"+$(this).attr('name')+"']:checked"), function(){
            favorite.push($(this).val());
        });
        console.log(names);
        console.log(favorite);
    });
});

```

[![See image](https://i.stack.imgur.com/OvTWs.png)](https://i.stack.imgur.com/OvTWs.png)

My expected output is like below

```
?sport=football~baseball~cricket&food=choclate~biscuits

```

If user has selected food first then it should be like this :-

```
?food=choclate~biscuits&sport=football~baseball~cricket

```

Please help me how can i achieve this type of functionality
note :- My filters will be dynamic means if i add more filters it will automatically embedded to query string. 
In image it's showing Getvalues button.. I want to get query string on click on checkbox. Forget about there is no button. Thanks