Как добавить к каждому полю в форме публикаций тип file свою иконку.

У меня есть иконка которую я хотел бы добавить к каждому полю тип file что бы при ее нажатий срабатывало тоже самое что и если бы я нажал на кнопку добавить файл.
<label for="id_rcl_but" class="icon"></label>
Могу ли я как нибудь это сделать?

Не получится мне заменить кнопку иконкой если я сделаю это через :after то потом не смогу скрыть кнопку

Да но если использовать js в конце всей формы. Например append html, то либо это будет работать хорошо только для первой что мне не подходит, либо придется писать для каждой кнопки свое действие onclick по классу что тоже не очень. Можно конечно это сделать одной функцией но все рано необходимо знать все классы заранее. Можно ли как то это сделать без костылей? Или вы предлагаете что то другое?
Уточню основная кнопка Выберите файл должна быть скрыта а вместо нее была иконка которая выполняет все функций этой кнопки

Может вы знаете способ на js который не требует знания заранее всех классов а цеплялся за каждый file-field отдельно
И работал только внутри своего div rcl-form-field

Мне не нужно прям супер универсальное средство. Я просто не хочу делать костыль и писать для каждого отдельного метополя свою функцию

<div id="form-field-faile1" class="rcl-form-field field-file">
<label>faile1</label>
<div id="rcl-field-faile1" class="rcl-field-input type-file-input">
<div class="rcl-field-core">
<span id="faile1-content" class="file-field-upload">
<input data-size="100" data-ext="" type="file"   name="faile1" class="file-field" id="faile1" value=""/>
 (<span class="allowed-types">Разрешенные типы файлов: </span>. Макс. размер: 100MB)
 <script type="text/javascript">rcl_init_field_file("faile1");</script>
 </span></div></div></div>
 
 <div id="form-field-faile2" class="rcl-form-field field-file">
 <label>video panorama </label>
 <div id="rcl-field-faile2" class="rcl-field-input type-file-input">
 <div class="rcl-field-core"><span id="faile2-content" class="file-field-upload">
 <input data-size="100" data-ext="" type="file"   name="faile2" class="file-field" id="faile2" value=""/>
 (<span class="allowed-types">Разрешенные типы файлов: </span>. Макс. размер: 100MB)
 <script type="text/javascript">rcl_init_field_file("faile2");</script></span></div></div></div>
 
 <script> 
$( "#faile1" ).append( "<label for='faile1'>icon1</label>" );
$( "#faile2" ).append( "<label for='faile2'>icon1</label>" );
 </script>

var sum =  $( "input[type='file']" ).length;
for (var i = 0; i < sum; i++) {
$( "#faile"+i ).append( "<label for='faile1"+i+"'>icon"+i+"</label>" );   
}

Я не совсем понимаю какой скрипт вы от меня хотите
У меня есть только несколько форм публикаций для разных целей

и стандартная файл темы

	<!--Страница--> 
	<div class="page_full">
		<?php the_post(); ?>
		<div class="page_from">	
<?php 			

	the_content();	
?>
 <script>js</script> 	
</div>
		</div>

Значит вы не знаете как знаете как заменить кнопку file на иконку.
Я просто надеялся что есть какой нибудь хук wp-recall что бы в цикл вывода полей добавить свою иконку
Ну или получить по отдельности каждый id и вернуть его

var sum = $( ".file-field" ).length;
for (var i = 0; i < sum; i++) {
var id = $( ".file-field :eq("+i+")" ).attr("id");
$(".file-field :eq("+i+")").append( "<label for='"+id+"'>icon"+i+"</label>" );   
}