Оберните шорткоды в конец поста в конверт

Question

Интересно, как это отсортировать проще всего: в конце сообщения Worpress я поместил один или несколько шорткодов, чтобы получить пользовательский контент, определенный в functions.php.

Каждый шорткод имеет тот же классproduct_icon, но разные изображения:

Таким образом, сообщение может выглядеть так:

<p>content...</p>
<p>content...</p>
[icon1] (shortcode)
<div class="product_icon">
  <img src="icon1.png"> 
</div>
[icon2] (shortcode):
<div class="product_icon">
  <img src="icon2.png"> 
</div>

Как обернуть каждый product_icon div внутри div-обертки?Количество и порядок шорткодов варьируется от поста к посту.

Я знаю, что могу использовать jQuery jQuery(".product_icon").wrapAll('<div class="wrapper">'); - но есть ли более предпочтительный способ, которым я могу использовать в своем файле функций?

Ожидаемый результат:

<div class="wrapper">
  <div class="product_icon">
    <img src="icon.png">
  <div class="product_icon">
    <img src="icon.png"> 
  </div>
</div>