Javascript 购物化。将下拉列表更改为集合标记筛选器的单选按钮

嗨，我正在看这个教程，它使用了一个下拉菜单，但我的目标是将它改为单选按钮，并以同样的方式工作。在一个标题下使用多个标记，可以选择多个标记来创建集合过滤器。这是我正在更改的教程：

下面是我将下拉菜单改为单选按钮的代码，效果很好。我的问题是当我选择它们来创建过滤器时。我想我在更改jquery以选择单选按钮时出错了

全部的
{collection.tags%中的标记的%s}
{%如果标记包含'type-'%}
{%assign tagName=tag | remove:'type-'%}
{%如果当前_标记包含标记%}
{{标记名}}
{%elsif集合。所有_标记都包含标记%}
{{标记名}}
{%endif%}
{%endif%}
{%endfor%}


/*产品标签过滤器-适用于任何类型集合页面上的任何数量的过滤器*/
var collFilters=jQuery（'.coll-filter'）；
collpilters.change（函数（）{
var newTags=[]；
collFilters.each（函数（）{
if（jQuery（this.val（））{
push（jQuery（this.val（））；
}
});
if（新标记长度）{
var query=newTags.join（'+'）；
window.location.href=jQuery（{{'tag'| link_to_tag:'tag'}}'）。attr（'href'）。replace（'/'+'tag'，'/'+query）；
}
否则{
{%if collection.handle%}
window.location.href='/collections/{{collection.handle}}}'；
{%elsif collection.products.first.type==collection.title%}
window.location.href='{{collection.title}url_for_type}}'；
{%elsif collection.products.first.vendor==collection.title%}
window.location.href=“{{collection.title}url}用于供应商}”；
{%endif%}
}
});

因为jQuery用于将您选择的标记添加到URL。我原以为更改以下内容同样容易：

var collFilters = jQuery('.coll-filter');
collFilters.change(function() {

到

然而，当我在我的两个标签上测试这一点时，它似乎将它们粘在了一起——红葡萄酒+白葡萄酒。您可以在我的店铺上看到：-密码：yiatsu

多谢各位。我希望我解释得足够好

var collFilters = jQuery("input[name='coll-filter']");
collFilters.onclick(function() {