add row click

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>

<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>

<style>


</style>
</head>
<body>
<div class="container">
    <div class="row">
      <div class="col-lg-12">
          <h1>Table Records</h1>
          <table class="table table-bordered table-hover" id="tableAddRow">
              <thead>
                  <tr>
                      <th>User Name</th>
                      <th>Email</th>
                      <th>Password</th>
                      <th style="width:10px"><span class="glyphicon glyphicon-plus addBtn" id="addBtn_0"></span></th>
                  </tr>
              </thead>
              <tbody>
                  <tr id="tr_0">
                      <td><input type="text" id="userName" class="form-control"/></td>
                      <td><input type="text" id="email" class="form-control" /></td>
                      <td><input type="text" id="password" class="form-control" /></td>
                      <td><span class="glyphicon glyphicon-minus addBtnRemove" id="addBtnRemove_0"></span></td>
                  </tr>
              </tbody>
          </table>
      </div>
    </div>
</div>
<script>
    $(document).ready(function () {
    $('.addBtn').on('click', function () {
        //var trID;
        //trID = $(this).closest('tr'); // table row ID
        addTableRow();
    });
     $('.addBtnRemove').click(function () {
        $(this).closest('tr').remove();
    })
    var i = 1;
    function addTableRow()
    {
        var tempTr = $('<tr><td><input type="text" id="userName_' + i + '" class="form-control"/></td><td><input type="text" id="email_' + i + '" class="form-control" /></td><td><input type="text" id="password_' + i + '" class="form-control" /></td><td><span class="glyphicon glyphicon-minus addBtnRemove" id="addBtn_' + i + '"></span></td></tr>').on('click', function () {
           $(this).closest('tr').remove();
           $(document.body).on('click', '.TreatmentHistoryRemove', function (e) {
                $(this).closest('tr').remove();
            });
        });
        $("#tableAddRow").append(tempTr)
        i++;
    }
});
</script>
</body>
</html>