Why do I have to use conditional when using JS in VWO?

Question

I'm doing an A/B test, but I noticed that I have to change everything via JS, I just don't understand why I can't just use something like this:

document.getElementById("myDIV").style.background = "url('smiley.gif')

Here is an example of a code used in VWO with JS

  function colpromo() {
      if (typeof (catalogpageloaded) == 'undefined') {
        window.catalogpageloaded = 'loaded';
        // javascript changes here
        /*Eliminating content*/
        const BANNER = document.querySelector(".col-promo-with-cta-module");
        BANNER.remove();
        const HERO = document.querySelector(".hero-content .hero-content-wrapper ");
        const HERO_CHILDREN = Array.from(HERO.children);
        HERO_CHILDREN[2].remove();
        HERO_CHILDREN[3].remove();

Is there any documentation on how to use JS to do an A/B test?

Answer 1

You can try firing your JS code on console of dev tools and see if it gives you the desired output. If yes, it should work fine via VWO code editor as well. Extra code will not be needed then.