Show Hide checkboxes

Question

THE SCENARIO:

In the html example showed on the link below, i have multiple checkboxes which when you click it must show or hide:

THE EXAMPLE:

Based on link below, when you open the specific page, it must show the folowing checkboxes:

All, District, Area, Category, Restaurant, Shop, Houses

If you click for example on District it will show you just District1, and if you click District1 it will show you District2 and the opposite if you uncheck. But in the same time when you click District1 for example it will show you if you have just Restaurants and Shops.

I added the link from jsfiddle with the html code.

THE QUESTION:

Can someone do the javascript? Because i do not know javascript

Thank you in advance,

The example

Answer 1

$('.district').hide();
$("#district").on('change',function () {
    if(this.checked)
    {
        $('.district').show();
    }
    else
    {
        $('.district').hide();
    }
});​

Check This Edit