Show Hide button, atleast one checkbox is checked

Question

When I check one or many boxes it shows the buttons "btns" but if i uncheck one it hides them, how do I get it to stay if one or many checkbox is still checked

<input type='checkbox' class='checklist' name='id[]' value='$id' />
<input type='checkbox' class='checklist' name='id[]' value='$id' />
<input type='checkbox' class='checklist' name='id[]' value='$id' />
<input type='checkbox' class='checklist' name='id[]' value='$id' />

$(".btns").hide();

$(".checklist").click(function() {
    if($(this).is(":checked")) {
        $(".btns").show();
    } else {
        $(".btns").hide();
    }
});

Answer 1

You can check for the amount of checked checkboxes. If it's length is 0 - hide the element, if not - show it.

 $(".checklist").click(function() { $('.btns').toggle( $(".checklist:checked").length > 0 ); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type='checkbox' class='checklist' name='id[]' value='$id' /> <input type='checkbox' class='checklist' name='id[]' value='$id' /> <input type='checkbox' class='checklist' name='id[]' value='$id' /> <input type='checkbox' class='checklist' name='id[]' value='$id' /> <p class='btns' hidden>btns</p> 

Answer 2

$(".checklist").click(function() {
var check_count=$(".checklist:checked");
if(check_count.length>0){$(".btns").show();}
else{$(".btns").hide();}
});

It check if any of checklist check so show .btns else hide it