Javascript 对div使用JS prepend，而不是隐藏

我有一些带有选择框的现有代码，其中我查看选项值并将其与foreach循环中div的隐藏输入值相匹配。我让它以我想要的方式工作（其中，根据选择，如果隐藏输入的值为“0”，它将隐藏该div）。同样，显示/隐藏工作非常完美

但是，我现在需要让它工作，以便如果值为“1”，它将预先处理那些受影响的div或首先显示它们。我以前从未使用过prepend或append，由于某些原因，我无法使其正常工作。我尝试将值“0”与append一起使用，但它只是隐藏了所有内容。我想prepend会更好

以下是上一个正在使用的“隐藏”javascript：

<script type="text/javascript">
$(function(){

$('#filterText').on('change', function() {
  var currentVal = $(this).val();
  console.log(currentVal)

  $(".group-container").show();
  if (currentVal == 'popularity') {
  $('.group-container input[name="topseller"]').each(function (index, value){
  if($(this).val() == "0"){
        $(this).parent('.group-container').hide();
        //console.log(currentVal)
    }
    });
  } else if (currentVal == 'recently_ordered') {
    $('.group-container input[name="reorder"]').each(function (index, value){

        if($(this).val() == "0"){
                $(this).parent('.group-container').hide();
                // console.log(currentVal)
            }
      });
  }
});
});

</script>

$（函数（）{
$（'#filterText'）。在（'change'，function（）上{
var currentVal=$（this.val（）；
console.log（currentVal）
$（“.group container”）.show（）；
如果（currentVal=='popularity'）{
$（'.group container input[name=“topseller”]'）。每个（函数（索引，值）{
如果（$（this.val（）=“0”）{
$（this.parent（'.group container'）.hide（）；
//console.log（currentVal）
}
});
}else if（currentVal==“最近订购的”）{
$（'.group容器输入[name=“reorder”]'）。每个（函数（索引，值）{
如果（$（this.val（）=“0”）{
$（this.parent（'.group container'）.hide（）；
//console.log（currentVal）
}
});
}
});
});

这是HTML

<div>
   <span style="color:#fff;"><strong>Sort by:</strong></span>
        <select id="filterText" class="uk-text-muted" style="margin-top:10px; width:33%; height:30px; font-size: 16px;" >
        <option id="allitems" class="uk-text-muted" style="font-size: 16px;" selected data-default value="" selected data-default>All Items</option>
                                      file
        <option id="recent" class="uk-text-muted" style="font-size: 16px;" value="recently_ordered">Recently Ordered </option>
       </select>
    </div>

@foreach ($orderFormData->pgroups as $pgroup)
<div class="group-container">
        <!-- <input type='hidden' name='search' value='{{ x.search }}' > -->
        <input type="hidden" name="topseller" value="{{$pgroup->topseller}}" />
        <input type="hidden" name="reorder" value="{{$pgroup->reorder}}"/>

     //rest of the content here

排序依据：
所有项目
文件
最近订购
@foreach（$orderFormData->pgroups作为$pgroup）
//其余的内容在这里

我正在尝试新的JS，但没有任何动作：

<script type="text/javascript">
$(function(){

$('#filterText').on('change', function() {
  var currentVal = $(this).val();
  console.log(currentVal)

  $(".group-container").show();

  if (currentVal == 'recently_ordered') {
    $('.group-container input[name="reorder"]').each(function (index, value)
{

        if($(this).val() == "1"){
                $(this).prepend('.group-container')            
            }
      });
  }
});
});

</script>

$（函数（）{
$（'#filterText'）。在（'change'，function（）上{
var currentVal=$（this.val（）；
console.log（currentVal）
$（“.group container”）.show（）；
如果（currentVal=='最近订购'）{
$（'.group容器输入[name=“reorder”]'）。每个（函数（索引，值）
{
如果（$（this.val（）=“1”）{
$（this）.prepend（“.group container”）
}
});
}
});
});

$（this）.prepend（“.group container”）

这段代码只是在所选元素中的文本“.groupcontainer”前面加上前缀。所以你会得到

 <input ....>.group-container</input>

.group容器

如果您改为这样做：

$(this).prepend('<div class="group-container">);

$（this.prepend（'）；

您可以将其添加到现有元素的开头：

<input....><div class="group-container"></div></input>

我想你想要的是“包裹”：

$（this.wrap（“”）；

哪个应该让步

<div class="group-container"><input.../></div>

---

我尝试了此操作，但没有任何操作，也没有控制台错误。但我不确定这是否正是我想要的方法。请参阅，如果下拉列表值为最近排序的

，
，并且我对any.group container div的隐藏输入值为1，我只希望页面洗牌/筛选并在页面上首先显示那些受影响的div
<div class="group-container"><input.../></div>