What is the correct way to listen to checkboxes being checked/unchacked?

Im using this code, to check if checkbox is checked and if it is, show submenu and specific layer on the map:

    $('input').on('change', function (){
            var x = $( 'input:checked' ).val(); // x gets the value attribute of changed checkbox
            if ($('input').is(':checked')){
                sublayers.getSubLayer(x).show(); // shows specified layer on the map
                $('#' + x).show(); // shows id targeted submenu under the checked checkbox
            }
            else {
                sublayers.getSubLayer(x).hide(); // hides sublayer on the map if unchecked
                $('#' + x).hide();  // hides specific submenu
            }
    });

So what happens is that the first checkbox works right, and following checkboxes do not respond. More to it if i start checking checkboxes from the bottom to top they work but show sublayer that fits one checkbox above. Also uncheck doesnt trigger anything.