title: Trying to automaticaly add vendors prefix when needed (Webkit, Moz, etc.) to all css file using cssHooks
body: <p>i'm trying to use a function to automatically looking for every property on my css file that needed to be renamed with the vendor prefix of the navigator. I could managed to get the wanted name of the prefix (Webkit) + the property name (backdropFilter) together (WebkitBackdropFilter) but I'm blocked with the &quot; cssHooks &quot; function and his get and set to change the prop. name. Nothing is happening when I load the webpage. I'm sure it's my mistake... I show you the code.</p>
  <p>$.styleSupport = function(prop) {</p>
  <pre><code>let vendorProp, supportedProp,
  capProp = prop.charAt(0).toUpperCase() + prop.slice(1),
  prefixes = [&quot;Moz&quot;, &quot;Webkit&quot;, &quot;O&quot;, &quot;ms&quot;],
  div = document.createElement(&quot;div&quot;);
  
  if (prop in div.style) {
         supportedProp = prop;
  } else {
         for (let i = 0; i &lt; prefixes.length; i++) {
             vendorProp = prefixes[i] + capProp;
             if (vendorProp in div.style) {
                  supportedProp = vendorProp;
                  break;
             }
         }
  
  
   div = null;
   $.support[prop] = supportedProp;
   return supportedProp;
  </code></pre>
  <p>}</p>
  <p>$(document).ready(function() {</p>
  <pre><code> let myDomProp = 'backdropFilter';
   let myDomPropPrefixed = $.styleSupport(myDomProp);
  
     if (myDomPropPrefixed &amp;&amp; myDomPropPrefixed !== myDomProp) {
        $.cssHooks[myDomProp] = {
            get: function (elem, computed, extra) {
                return $.css(elem, myDomPropPrefixed);
            },
            set: function (elem, value) {
                elem.style[myDomPropPrefixed] = value;
            }
        };
    }
  </code></pre>
  <p>});</p>