How to get cell values using jQuery

I am writing a script to get the text inside the TH elements of a table and have written the below code that works well in Firefox and Opera but doesn’t work in IE. What can I do to make it work in IE also?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<title>Table Selector Test</title>
	<script src="js/jquery.js" type="text/javascript"></script>
</head>
<body>

<script type="text/javascript">

	$(document).ready(function() {
		$('#tbl th').each(function() {
			alert(this.textContent);
		});
	});

</script>

<table id="tbl" border="1">
	<thead>
		<tr>
			<th class="sortable"><a href="#">SrNo</a></th>
			<th class="sortable">Name</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>1</td>
			<td>Zahra</td>
		</tr>
		<tr>
			<td>2</td>
			<td>Ala</td>
		</tr>
		<tr>
			<td>3</td>
			<td>Ahmed</td>
		</tr>
		<tr>
			<td>4</td>
			<td>Husain</td>
		</tr>
	</tbody>
</table>

</body>
</html>

jQuery has its very own “text” method:


$(document).ready(function() {
    $('#tbl th').each(function() {
        var text = $(this).text();
        alert(text);
    });
}); 

Works like a charm. Thanks a lot :slight_smile: