Edit in JSFiddle

var students = [];
window.students = students;
students.push({
    name: 'James',
    age: 15
});
students.push({
    name: 'Arthur',
    age: 14
});
students.push({
    name: 'Kelly',
    age: 13
});

var myModel = function () {
    this.students = ko.observableArray(students);
}
window.pageModel = new myModel();
ko.applyBindings(window.pageModel);

//function to add a new student to the table
window.AddStudent = function(){
    var name = document.getElementById('student-name').value;
    var age = document.getElementById('student-age').value;    
    window.pageModel.students.push({
        name: name, age: age});
}
<h2>Student Entry Form</h2>

<div>
    <div id="entry">
        <table>
            <tr>
                <td>Name</td>
                <td>
                    <input id="student-name" type="text" />
                </td>
            </tr>
            <tr>
                <td>Age</td>
                <td>
                    <input id="student-age" type="text" />
                </td>
            </tr>
            <tr>
                <td></td>
                <td>
                    <input type="button" value="Add" onclick="AddStudent()"/>
                </td>
            </tr>
        </table>
    </div>
</div>
 <h3>List of students</h3>
<table id="students">
    <thead>
        <tr>
            <th>Name</th>
            <th>Age</th>
        </tr>
    </thead>
    <tbody data-bind="foreach: students">
        <tr>
            <td class="width" data-bind="text: name"></td>
            <td class="width centre" data-bind="text: age"></td>
        </tr>
    </tbody>
</table>