Hiding Empty column in html table using jQuery .. doesn't work :\
===

    <html>
	<head>
		<script  src="jquery-1.4.4.js"></script>
		<script>
		    

			$('table').each(function(a, tbl) {
			    var currentTableRows = $(tbl).attr('rows').length - 1;
			    $(tbl).find('th').each(function(i) {
			        var remove = 0;
			        var currentTable = $(this).parents('table');
			
			        var tds = currentTable.find('tr td:nth-child(' + (i + 1) + ')');
			        tds.each(function(j) { if (this.innerHTML == '') remove++; });
			    
			        if (remove == currentTableRows) {
			            $(this).hide();
			            tds.hide();
			        }
			    });
			});
		      
		</script>
	</head>
	<body>
		<table  border="1" >  
			<tr><td colspan="4" > alaa </td></tr>
			<tr><th>Column1</th><th>Column2</th><th>Column3</th><th>Column4</th></tr>
			<tr ><td>1st</td><td>1.1</td><td></td><td></td></tr>
			<tr class="data"><td>2nd</td><td>2.1</td><td></td><td></td></tr>  
			<tr class="data"><td>3rd</td><td>3.1</td><td></td><td>1</td></tr>  
			<tr class="data"><td>4th</td><td></td><td></td><td></td></tr>
			<tr ><td></td><td></td><td></td><td></td></tr>
			<tr class="data"><td></td><td></td><td></td><td></td></tr>  
		</table>

	</body>
</html>

here is my code ... I thought that the problem from the library, so I tried many libraries such as jQuery 1.4.4 , 1.5.2 and others 

Here is the test and it works fine there http://jsfiddle.net/nlovatt/JsLn8/ 

but in my file .. it doesn't work ..

regards,

