Hiding product swatches or blurring or crossing when variation not available v2

Hello

I've been checking the forum and you need something similar to this web address that I show:

https://bemorebg.com/product/black-logo-oversize/#

That is to say, Hiding product swatches or blurring or crossing when variation not available.

I have used the java code in the topic that appears in topics (https://forum.muffingroup.com/betheme/discussion/comment/250563#Comment_250563), but it still does not work.

I would like to use it on the store page, on the section pages and on the product page.

Could you help us?

In java code it is:

****

document.addEventListener('DOMContentLoaded', function() {

 // Obtenemos el texto del elemento con clase. 'woocommerce-product-details__short-description'

 var availabilityText = document.querySelector('.woocommerce-product-details__short-description').innerText;

 // Dividimos el texto en variaciones

 var variations = availabilityText.split(',');

 // За всяка вариация, проверяваме наличността

 var variationLinks = document.querySelectorAll('.mfn-vr-options a');

 variationLinks.forEach(function(link) {

 // Вземаме буквата на вариацията от текста на връзката

 var variationLetter = link.innerText.trim();

 // Търсим буквата в текста на наличностите

 var regex = new RegExp(variationLetter + ' - (\\d) бр');

 var match = regex.exec(availabilityText);

 if (match && match[1] === '0') {

  // Ако вариацията не е налична, задраскай буквата и приложи същия стил като в CSS

  link.style.textDecoration = 'none'; // Премахваме задраскването

  link.style.position = 'relative'; // Приложи position: relative;

  var xElement = document.createElement('span'); // Създаваме елемент span за "X"

  xElement.innerText = 'X'; // Задаваме текста на елемента

  xElement.style.position = 'absolute'; // Приложи position: absolute;

  xElement.style.top = '50%'; // Позиционирай вертикално в средата на елемента

  xElement.style.left = '50%'; // Позиционирай хоризонтално в средата на елемента

  xElement.style.transform = 'translate(-50%, -50%)'; // Центрирай по хоризонтала и вертикалата

  xElement.style.fontSize = '20px'; // Задай големина на шрифта

  link.appendChild(xElement); // Добави "X" към връзката

 }

 });

});

****

Thanks