Custom Liquid does not change after Variant selection

[X-Bi]

I use the Impact Theme.

I would like my custom Liquid code in Shopify to change on the product page when the variant is changed.

With this code:

{% for variant in product.variants %}
  {% if product.selected_or_first_available_variant.id == variant.id %}
    <div class="variant-description">
      {{ variant.metafields.custom.beschreibung }}
    </div>
  {% endif %}
{% endfor %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script type="text/javascript">
  jQuery(document).ready(function($){
    // Funktion, um den Text basierend auf der ausgewählten Variante zu aktualisieren
    function updateVariantDescription() {
      var selectedVariantId = {{ product.selected_or_first_available_variant.id | json }};
      var description = '';
      {% for variant in product.variants %}
        if ({{ variant.id | json }} == selectedVariantId) {
          description = {{ variant.metafields.custom.beschreibung }};
        }
      {% endfor %}
      $(".variant-description").text(description);
    }

    // Bei Änderung der Variante aktualisieren
    $(document).on('change', ".single-option-selector", function(){

      updateVariantDescription();
    });

    // Initialen Text festlegen
    updateVariantDescription();
  });
</script>

This is the code that I’ve written in the Custom Liquid block.
The text only changes after reloading the page. Can someone help me?

[X-Bi]

Update:

ich habe an einem Workaround gearbeitet hier die Informationen die ich durchgeben kann:

In den Theme Liquids habe ich folgende anpassungen gemacht:

product-info.liquid
<variant-vdes form=“{{ product_form_id }}” class=“product-info__description” {% if product.selected_or_first_available_variant.metafields.custom.u_vdes == blank %}hidden{% endif %} {{ block.shopify_attributes }}>
{{ product.selected_or_first_available_variant.metafields.custom.u_vdes -}}

Dies habe ich unterhalb der SKU eingetragen damit dort das Metafield der jeweiligen Variante angezeigt wird. (Siehe Anhang: Bild 1.png)

theme.js.liquid
var VariantVDes = class extends HTMLElement {
constructor() {
super();
this._onVariantChangedListener = this._onVariantChanged.bind(this);
}
connectedCallback() {
document.forms[this.getAttribute(“form”)]?.addEventListener(“variant:change”, this._onVariantChangedListener);
}
disconnectedCallback() {
document.forms[this.getAttribute(“form”)]?.removeEventListener(“variant:change”, this._onVariantChangedListener);
}
_onVariantChanged(event) {
if (!event.detail.variant) {
this.hidden = true;
} else {
this.innerText = ${event.detail.variant["* <em>**metafields.custom.u_vdes**</em> *"]};
this.hidden = !event.detail.variant[" metafields.custom.u_vdes "];
}
}
};
if (!window.customElements.get(“variant-vdes”)) {
window.customElements.define(“variant-vdes”, VariantVDes);

Das bold geschriebene metafields.custom.u_vdes wird leider nicht gefunden, dies sorgt dafür, dass beim wechseln der Variante einfach nichts angezeigt wird. (Siehe Anhang: Bild 2.png)

Tausche ich in dem Teil des Codes metafields.custom.u_vdes zu beispielsweise sku funktioniert der wechsel aber es zeigt mir natürlich dann die SKU an:
else {
this.innerText = ${event.detail.variant["* _**sku**_ *"]};
this.hidden = !event.detail.variant[" sku "];
}
(Siehe Anhang: Bild 3.png)

Meine Vermutung war dann dass in der microdata-schema.liquid noch die definitionen gemacht werden müssen (das bold geschriebe ist das was ich hinzugefügt habe):
microdata-schema.liquid
{%- if variant.sku != blank -%}
“sku”: {{ variant.sku | json }},
{%- endif -%}
{%- if variant.metafields.custom.u_vdes != blank -%}
“vdes”: {{ variant.metafields.custom.u_vdes | json }},
{%- endif -%}

&&

“sku”: {{ product.selected_or_first_available_variant.sku | json }},
“vdes”: {{ product.selected_or_first_available_variant.metafields.custom.u_vdes | json }},

Leider hat das das Problem nicht gelöst.
Ich sollte noch erwähnen, dass ich alle Möglichen Optionen bei den event.detail.variant probiert habe (variant.metafields.custom.u_vdes, custom.u_vdes, u_vdes, vdes)

Ich hoffe ich konnte es verständlich erklären.

Grüße