Javascript TypeError: Cannot read property ‘indexOf’ of undefined

The problem is that you’re modifying the array while jQuery’s $.each is looping over it, so by the time it gets to the end, the entry that used to be at index 2 is no longer there. (I admit I’m a bit surprised $.each behaves that way, but I haven’t used $.each in at least five years, so…)

If the goal is to remove matches from the array, the better choice is filter:

var cart_products = ["17^1", "19^1", "18^1"];
var product = 17;

cart_products = cart_products.filter(function(item) {
    return item.indexOf(product+"^") === -1;
});
console.log(cart_products);

Expand snippet

…or alternately if it’s important to modify the array in-place rather than creating a new one use a boring for loop as Andreas points out looping backward through the array so it doesn’t matter when you remove things:

var cart_products = ["17^1", "19^1", "18^1"];
var product = 17;

var target = product + "^";
for (var index = cart_products.length - 1; index >= 0; --index) {
  if (cart_products[index].indexOf(target) !== -1) {
    cart_products.splice(index, 1);
  }
}
console.log(cart_products);

Leave a Comment