repeat the view code depending on the observableArray length? - knockout.js

repeat the view code depending on the observableArray length? - knockout.js

Need help to create a table depending on the observableArray length.
The observableArray - Pages - is an array with numbers. Now i want to
create a table row with 10 numbers in each row. for the 11th element, i
have to insert from a new row. So a new row has to be created after 10
elements.
So my table should be like:
1 2 3 4 5 6 7 8 9 10
11 12 13 14 15 16 17 18 19 20
21 22 23
The view model code is:
function Pagination() {
var self = this;
self.TotalPageCount = ko.observable("23");
self.Pages =
ko.observableArray(['1','2','3','4','5','6','7','8','9','10',
'11','12','13','14','15','16','17','18','19','20',
'21','22','23' ]);
};
The view code:
<table id="pagerTable">
<tbody data-bind="foreach: Pages.length / 10">
<tr> <!-- have to create table row for every 10 elements -->
<td>
<a data-bind="attr:{ 'id': $index }, text: $data " ></a>
</td>
</tr>
</tbody>
</table>
Can anyone help me with a solution? JSfiddle:
http://jsfiddle.net/ondacinaynakalkur/w928F/1/
The fiddle link just prints the entire array content. I want the array
content to be displayed in a table with 10 elements in each row:
1 2 3 4 5 6 7 8 9 10
11 12 13 14 15 16 17 18 19 20
21 22 23
Thanks in advance.