javascript - show div on when checkboxes are clicked

Question

So im trying to show a div when one of the multiple checkboxes are clicked and it is working but when you unclick a checkbox it hides the div even when checkboxes are still clicked. I cant seem to figure out how to make it hide the div only when no checkboxes are left clicked.

<input type="checkbox" name="list[]" value="1" id="fldcheckbox" onclick="fnchecked(this.checked);">

<input type="checkbox" name="list[]" value="2" id="fldcheckbox" onclick="fnchecked(this.checked);">

<input type="checkbox" name="list[]" value="3" id="fldcheckbox" onclick="fnchecked(this.checked);">

<div id="ref_options" style="display:none;">
example
</div>

<script>
function fnchecked(blnchecked)
{
if(blnchecked)
{
document.getElementById("ref_options").style.display = "";
}else{
document.getElementById("ref_options").style.display = "none";
}

}
</script>

Answer 1

Use change event instead of click.