jqueryのbeforeメソッドを使用しているときに、2つのテキストボックスをインスタント化して表示するにはどうすればよいですか？

Question

jqueryのbeforeメソッドを使って、私のwordpressページの1つにテキストボックスを適用しました。しかし問題は、1つではなく2つのテキストボックスを表示していることです。私は1つだけのテキストボックスを表示したい。これは私がこのコード を VAR $ = jQuery.noConflict（）を使用しています

var $ = jQuery.noConflict(); 
$(".product-listing-table").before("<p><input type='text' placeholder='search product by name, status, sku' id='upen'></p>"); 

Answer 1

使用この

var $ = jQuery.noConflict(); 
$(document).ready(function() { 
    // This will remove the serach_input 
    $(".search_input").remove(); 
    $(".product-listing-table").before("<p class="search_input"><input type='text' placeholder='search product by name, status, sku' id='upen'></p>"); 
});