I have a page as below:
<head>
<script type="text/javascript" src="jquery-1.6.1.js"></script>
<script type="text/javascript">
$(document).ready( function() {
var i = 1;
$('#prev').click(function() {
$.ajax({
type: 'POST',
url: 'ajax.php',
data: 'id=' + i,
dataType: 'json',
cache: false,
success: function(result) {
$('#content1').html(result[0]);
$('#content2').html(result[1]);
$('#content3').html(result[2]);
$('#content4').html(result[3]);
$('#content5').html(result[4]);
$('#content6').html(result[5]);
},
});
i++;
});
});
</script>
</head>
<body>
<table>
<tr>
<td id="prev">prev</td>
<td id="content1">X</td>
<td id="content2">X</td>
<td id="content3">X</td>
<td id="content4">X</td>
<td id="content5">X</td>
<td id="content6">X</td>
<td id="next">next</td>
</tr>
</table>
</body>
The code works well, but is there any solution to do this in one step? I mean if I can provide content 1-6 a common class content instead of specific ids. How can I do this if content cells don’t have a specific ids (from content1 to content6and has a common class content)?
Take a look to the .each() iterator