隐藏标签点击显示

今天做了一个隐藏标签，点击显示。
由于要跟数据库做关联，根据数据库中的数据循环定义div标签

<c:forEach items="${grid }" var="g">
	<div>
	</div>
</c:forEach>

1、想到了用script脚本来处理事件，于是就有了

<script type="text/javascript" language="javascript">
    function click(name){
        var ui = document.getElementById("h");
        if (ui.style.display == "none"){
        	ui.style.display = "block";
        }
        if(ui.style.display == "block"){
        	ui.style.display = "none";
        }
    }
</script>

并将div元素定义id属性，问题是div标签数量是变化的，id属性唯一不能固定，用了其他不唯一的属性也不能定位标签。
2、于是就将id属性定义为变量，随着元素的变化，id也变化

<script type="text/javascript" language="javascript">
    function click(name){
        var ui = document.getElementById(name);
         if (ui.style.display == "none"){
            	ui.style.display = "block";
            }
            if(ui.style.display == "block"){
            	ui.style.display = "none";
            }
    }
</script>

同时事件也要传递相应参数

<a href="javaScript:click('${g.name }')">${g.name }</a>

可以定位到标签了，但是遇到不能将style.display属性变为"“或者” block"。
3、将两个if判断改为一个if和else，问题解决了

if (ui.style.display == "none"){
        	ui.style.display = "block";
        	//location.reload();
        }else{
        	ui.style.display = "none";
        }