你的js代码要想运行有效，必须满足两个条件：一、jQuery必须加载完毕；二、页面的DOM结构必须加载完毕。如果把代码放到head，那么这时候jQuery和你的代码几乎是同时加载的，当你的代码运行时，jQuery很可能尚未加载完毕，这样条件一就很可能不满足；其次，这时候HTML的body尚未加载，这样条件二也不满足，所以代码运行无效。如果把代码放到body中所有标签的最后面，当你的代码运行时，jQuery和DOM都肯定已加载完毕，所以是有效的。
其实把你的js代码放到head中也是可以的，但必须放到load事件函数中，即这样：
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$("div:contains('a')").css("text-decoration", "underline")
})
</script>
</head>
<body>
<div>abc</div>
<div>asdf</div>
<div>qwer</div>
<div>asdw</div>
</body>
</html>
不生效可能是你没有阻止事件冒泡。当点击取消按钮的时候，会触发点击id为name的元素，所以重新加上了带有show的类名。
应该在取消的按钮点击事件参数加上e，函数内加上“e.stopPropagation()”阻止事件冒泡。
