Firebase chat box

HTML

<script src="https://cdn.firebase.com/js/client/2.2.1/firebase.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<div class="container">
  <div class="row">
    <div class="col-md-6 col-md-offset-3">
      <div class="row">
        <div class="col-md-12">
          <div class="panel panel-primary">
            <div class="panel-heading">
              <i class="glyphicon glyphicon-user"></i>
              <h6 class="panel-title">ChatBox</h6>
              <div class="btn-group btn-group-xs pull-right">
                Hello, <span id="txtName"></span>
              </div>
            </div>
            <div class="panel-body">
              <div class="row">
                <div class="col-sm-12" id="scollDiv">
                  <table class="table table-hover" id="messageContainer">
                    <tr></tr>
                  </table>
                </div>
              </div>
            </div>
            <div class="panel-footer">
              <form>
                <div class="input-group input-group-sm">
                  <span class="input-group-addon">
                    <i class="glyphicon glyphicon-pencil"></i>
                  </span>
                  <input type="text" class="form-control" id="txtText" placeholder="Type your message here ..">
                  <span class="input-group-btn">
                    <button class="btn btn-primary" type="submit" id="btnSend">Send</button>
                  </span>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
    </div>

CSS

body {
   background-color:#ccc;
}   
.panel-title {
  display:inline;
}
tr td:first-child {
  font-weight: bold;
  width: 100px;
}
#scollDiv {
  max-height: 500px;
  overflow-y: scroll;
}
.container {
  margin-top: 20px;
}

JavaScript

$(document).ready(function () {
  var name = prompt('Enter your name', 'guest');
  var myFirebase = new Firebase('https://chatbox-23d3c.firebaseio.com/');
  if (name) {
    $('#txtName').text(name);
    $('#btnSend').on('click', function (e) {
      e.preventDefault();
      var text = $('#txtText').val();
      if (text) {
        myFirebase.push({name: name, text: text}); 
        $('#txtText').val('');
      }
    });

    myFirebase.on('child_added', function (snapshot){
      var message = snapshot.val();
      var html = 
          '<tr>' + 
          '<td><i class="glyphicon glyphicon-user"></i> ' + message.name + ': </td>' + 
          '<td>' + message.text + '</td>' + 
          '</tr>';
      $('#messageContainer tr:last').after(html);
      $('#scollDiv').animate({
        scrollTop: $('#scollDiv')[0].scrollHeight
      }, 0);
    });
  } else {
    window.location.reload();
  }
});