keep showing one div tag until all checked box are unmarked like gmail
<p>my question is that i want to hide my delete button initially, and as when user mark on checkbox 
the delete button keep going on  showing up until all the checkbox are not unmarked </p>

<p>this is how i try to do this, the problem i faced when i unmarked the one checkbox my delete button is vanished though my rest of checkbox is marked </p>

<pre><code>    &lt;%@page import="java.util.List"%&gt;
&lt;%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%&gt;
&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%&gt;
&lt;%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%&gt;
&lt;%@page
    import="com.nousinfo.tutorial.employee.service.model.bo.EmployeeBO"%&gt;

&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt;
&lt;html&gt;
&lt;link rel="stylesheet" href="css/style.css" type="text/css"&gt;&lt;/link&gt;
&lt;head&gt;
&lt;meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"&gt;


&lt;title&gt;Home&lt;/title&gt;

&lt;script type="text/javascript"&gt;
    function windowLoadByName(windowHeight, windowWidth) {
        var centerWidth = (window.screen.width - windowWidth) / 2;
        var centerHeight = (window.screen.height - windowHeight) / 2;

        newWindow = window.open(
                'PopUp.jsp',
                'mywindow',
                'resizable=0,width=' + windowWidth + ',height=' + windowHeight
                        + ',left=' + centerWidth + ',top=' + centerHeight,
                "status=1").divHiding(1);
        newWindow.focus();

    }
    function windowLoadById(windowHeight, windowWidth) {
        var centerWidth = (window.screen.width - windowWidth) / 2;
        var centerHeight = (window.screen.height - windowHeight) / 2;
        newWindow = window.open(
                'PopUp.jsp',
                'mywindow',
                'resizable=0,width=' + windowWidth + ',height=' + windowHeight
                        + ',left=' + centerWidth + ',top=' + centerHeight)
                .divHiding(2);

        newWindow.focus();
        return newWindow.name;
    }

    function loadName(name) {

        this.firstName = name;
        window.location = 'http://localhost:8080/EmployeeWeb/GetEmployee?key1='
                + encodeURIComponent(firstName);

    }
    function loadId(id) {

        this.id = id;

        window.location = 'http://localhost:8080/EmployeeWeb/GetEmployee?key2='
                + encodeURIComponent(id);

    }

    function showMe (it, box) { 
      var vis = (box.checked) ? "block" : "none"; 
      document.getElementById(it).style.display = vis;
    } 


&lt;/script&gt;

&lt;/head&gt;

&lt;body background="transparent"&gt;


    &lt;table width="951" height="116" border="0" align="center"&gt;
        &lt;tr&gt;
            &lt;td width="661" height="112" bgcolor="#D1D1FF"&gt;&lt;font size="6"&gt;EmployeeManagement&lt;/font&gt;
            &lt;/td&gt;
            &lt;td width="266" height="112" align="center" bgcolor="#FFFFFF"&gt;&lt;img
                src="image/nous.jpg" alt="1" width="266" height="84" /&gt;&lt;/td&gt;
        &lt;/tr&gt;
    &lt;/table&gt;
    &lt;p&gt;&amp;nbsp;&lt;/p&gt;


    &lt;table width="949" height="183" border="0" align="center"&gt;
        &lt;tr&gt;
            &lt;td height="42" align="center" bgcolor="#3366FF"&gt;&lt;strong&gt;Find
                    Employee &lt;/strong&gt;&lt;/td&gt;
        &lt;/tr&gt;

        &lt;tr&gt;
            &lt;td width="943" height="43"&gt;&lt;input id="findid" name="button"
                type="submit" value="Find_Employee_By_ID"
                onClick="windowLoadById(250,500)" /&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;

            &lt;td height="43"&gt;&lt;input id="findname" name="submit2"
                type="button" value="Find_Employee_By_Name"
                onClick="windowLoadByName(250,500)" /&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td&gt;&lt;form id="form2" action="GetEmployee"&gt;
                    &lt;input type="submit" name="submit3" value="Get_All_Employee" /&gt;
                &lt;/form&gt;&lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td&gt;&lt;form id="form2" action="CreateEmployee.jsp"&gt;
                    &lt;input type="submit" name="create" value="CreateEmployee" /&gt;
                &lt;/form&gt;&lt;/td&gt;
        &lt;/tr&gt;


    &lt;/table&gt;

    &lt;p&gt;&amp;nbsp;&lt;/p&gt;
    &lt;br&gt;
    &lt;br&gt;
    &lt;div id="div12"&gt;
        &lt;form action="UpdateEmployeeServlet"&gt;
            &lt;table width="725" border="1" align="center" cellpadding="5"
                cellspacing="5"&gt;
                &lt;tr&gt;
                    &lt;th width="118"&gt;check&lt;/th&gt;
                    &lt;th width="118"&gt;EmployeeNumber&lt;/th&gt;
                    &lt;th width="118"&gt;First Name&lt;/th&gt;
                    &lt;th width="118"&gt;Last Name&lt;/th&gt;
                    &lt;th width="118"&gt;Title&lt;/th&gt;
                    &lt;th width="118"&gt;Address1&lt;/th&gt;
                    &lt;th width="118"&gt;Address2&lt;/th&gt;
                    &lt;th width="118"&gt;City&lt;/th&gt;
                    &lt;th width="118"&gt;Detail
                    &lt;th&gt;
                &lt;/tr&gt;
                &lt;c:forEach var="employeeBO" items="${listemployeeBo}"&gt;
                    &lt;tr&gt;
                        &lt;td&gt;&lt;input type="checkbox" value='${employeeBO.empNumber}'
                            name="checked" onclick="showMe('div1',this)"&gt;&lt;/td&gt;
                        &lt;td&gt;${employeeBO.empNumber}&lt;/td&gt;

                        &lt;td&gt;${employeeBO.firstName}&lt;/td&gt;

                        &lt;td&gt;${employeeBO.lastName}&lt;/td&gt;

                        &lt;td&gt;${employeeBO.title}&lt;/td&gt;

                        &lt;td&gt;${employeeBO.address1}&lt;/td&gt;

                        &lt;td&gt;${employeeBO.address2}&lt;/td&gt;

                        &lt;td&gt;${employeeBO.city}&lt;/td&gt;



                        &lt;td&gt;&lt;a href="javascript:loadId(${employeeBO.empNumber})"&gt;Details&lt;/a&gt;&lt;/td&gt;

                    &lt;/tr&gt;
                &lt;/c:forEach&gt;

            &lt;/table&gt;
            &lt;div id="div1" style="display:none;"&gt;
                &lt;table&gt;

                    &lt;tr&gt;

                        &lt;td&gt;&lt;input type="hidden" name="updateStatusDelete" value="D" /&gt;
                            &lt;input type="submit" name="delete" value="Delete" /&gt;&lt;/td&gt;
                    &lt;/tr&gt;
                &lt;/table&gt;
            &lt;/div&gt;
        &lt;/form&gt;
    &lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>
