表单ID中带有jQuery的通配符数字

我有一段代码(缩写),它从Gravity Forms WordPress插件中呈现,没有挂钩或其他改变其输出的方式(除了分叉插件):

<div class="gform_heading">...</div>
<form id="gform_8" action="/volunteer/">
    <div class="gform_body gform-body">...</div>
    <div class="gform_footer top_label">...</div>
</form

我需要一个 div class="gform_heading">...</div> 做一个孩子 <form> 要素:

<form id="gform_8" action="/volunteer/">
    <div class="gform_heading">...</div>
    <div class="gform_body gform-body">...</div>
    <div class="gform_footer top_label">...</div>
</form

我计划使用这个jQuery来修改DOM。

$(".gform_heading").prependTo("[id^=gform_]");

然而,该网站有多种形式和 gform_... id的下划线后面有一个数字,该数字会根据呈现给页面的表单而变化。我需要在jQuery中通配符,这样它就可以用于任何形式,无论是现在还是将来,该网站可能嵌入到页面中。

我试过这个办法 Use wildcard ID with jQuery and get wildcard ID 在我的Inspector控制台中(替换我的表单ID和类名),但它不起作用。

最正确的方法是什么?

$('form').each(function(i, o) { let before = $(o).prev(); if (o.id.includes('gform_') && before.hasClass('gform_heading')) { before.prependTo($(o)).append(` - and my id if you need it is ${o.id.split('gform_')[1]}`) } })

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="gform_heading">gform_heading</div> <form id="gform_8" action="/volunteer/"> <div class="gform_body gform-body">...</div> <div class="gform_footer top_label">...</div> </form> <div class="gform_heading">gform_heading</div> <form id="other_8" action="/volunteer/"> <div class="gform_body gform-body">...</div> <div class="gform_footer top_label">...</div> </form>