Firebase Web ForEach on snapshot

I need to list all the records in an HTML page. below code is used for list all the records. I am getting the records. but instead of one, I am getting 3(there are 3 data in each snapshot). But I need to be it as one. ie, the first console.log print 1 result and the second one prints 3. I want both to be same.

Thanks in Advance...

JS code

var ref = firebase.database().ref("students");
ref.orderByKey().limitToFirst(1).on('child_added', function(snapshot) {

      if (snapshot.exists()) {
        var content = '';
        console.log(snapshot);
        snapshot.forEach(function(data) {
          console.log(data);
          var val = data.val();
          content += '<tr>';
          content += '<td>' + "test" + '</td>';
          content += '</tr>';
        });
        $('#ex-table').append(content);
      }

<table class="table table-striped" id="ex-table">
  <thead class="thead-inverse">
    <tr class="conwrapper">
      <th class="_proname _subconhead">Task Title</th>
      <th class="_proname _subconhead">Category</th>
      <th class="_proname _subconhead">Date</th>
      <th class="_proname _subconhead">Status</th>
    </tr>
  </thead>
  <tbody>
    <tr id="tr">
      <td id="titleTask"></td>
      <td id="categoryTask"></td>
      <td id="dateTask"></td>
      <td id="statusTask"></td>
    </tr>
  </tbody>
</table>