Javascript 从cookie中删除多个值

我有一个项目列表，它有两个值，一个名称和一个id。每个列表项目都是使用从cookie中提取的数据构建的。它还有一个delete按钮，基本上是查看HTML，然后从cookie中删除该项。虽然不漂亮，但效果很好

现在突然引入了第三个值（img src）。因此，我创建了一个新函数来创建cookie和构建列表。生活仍然很美好

但是，当我试图从数组中删除该项时，问题就出现了

JS

$('.deleteNewCookie').on('click', function () {
  var val = $(this).prev().prev().html(); // Search DOM for value

  var cookieStr = cookieData.split('|');
  createCookie('cokLocation', "", -1);
  var newCookie = '';
  $.each(cookieStr, function (index, value) {
     if (value != '') {
        var cookieAdd = value.split(',');
        if (cookieAdd[1] != val) {
           newCookie = newCookie + value + '|';
        }
     }
  });
  createCookie('cokLocation', newCookie, '300');
});

这是cookie中的一个项目的外观：

ID,Name,/image.png|

现在，当标记更简单且只有ID和名称时，这一功能可以正常工作，但当我现在单击

.deleteNewCookie

时，图像排序仍保留在cookie中。如何删除该数组（项）中的所有内容？为什么它显然只删除前两个值

标记

<li>
  <div class="myLocImg">
    <img src="/image.png">
  </div>
  <div class="myLocInfo">
    <h3>NAME</h3>
    <span url="locationid=ID" class="btn">More details</span>
    <a class="deleteNewCookie">Remove</a>
  </div>
</li>

名称
更多细节
去除

我有点不愿意重组我的cookie（因为它正在其他地方使用），但我可能会被说服作为最后的手段。我也没有使用任何插件，我对导入任何插件都不感兴趣。请仅提供纯JS或jQuery解决方案。：）

试图重现问题。代码按预期工作。代码的其他部分导致了这个问题

---

这个问题与“

createCookie（）

以及这些值是如何存储在HTML本身中的”有关。我真的不明白你的问题，你能举个例子说明发生了什么和预期的行为吗？噢，不赞成票让我很难过（我如何改进我的问题？不知道，不是我。但你可以用一个例子来澄清你的问题：）@sachleen我希望它删除包含

名称的位置中的所有值。这在旧方法中起作用（当时只有ID和名称）。现在它删除了前两个值，但留下了第三个值（图像源代码）？运行它并告诉我您希望输出是什么，而不是
New:ID，Foo，/image.png |