http://stackoverflow.com/questions/42615444/knockout-js-cannot-delete-after-adding-to-observable-array

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.1/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.min.js"></script>
<div class="col-lg-6 col-md-6 col-sm-12">
    <h4>Bullet Points</h4>
    <div id="oneLinedescriptions" class="input_fields_wrap">
        <!-- ko foreach: BulletPoints -->
        <div class="form-group">
            <div class="input-group">
                <input type="text" data-bind="value: value" class="form-control">
                <span data-bind="click: $parent.deleteBulletPoint" class="input-group-addon btn">-</span>
                <span style="margin-left: 8px;" data-bind="text: ko.toJSON($data)"></span>
            </div>
        </div>
        <!-- /ko -->
    </div>
    <button id="btnAddDescription" data-bind="click: addEmptyBulletPoint" type="button" class="btn btn-default add_field_button col-lg-12 animate-off">Add New Bullet Point</button>
</div>

JavaScript

var testData = { BulletPoints: [{value: "test1"}, {value: "test2"}] };

var vm = function (data) {
  var self = this;

  ko.mapping.fromJS(data, {}, self);

  this.deleteBulletPoint = function (bulletPoint) {
    self.BulletPoints.remove(bulletPoint)
  }

  this.addEmptyBulletPoint = function () {
    console.log(bulletPoint);
    self.BulletPoints.push({ value: ko.observable("") });
    console.log(self.BulletPoints())
  }
}

ko.applyBindings(new vm(testData));