Changing The (styling Of) The Form Submit Button When Text Is Present In The Textarea - Jade / Pug

This is code to render a form mixin in Node/Express (using Jade/Pug as the template engine) My goal is to disable the button when there is no text in the textarea and enable the bu

Solution 1:

Typical! I spend 30 minutes typing the question then find an answer 5 seconds later.

Leaving this here to help others.

How can I change an element's class with JavaScript?

TLDR... classList.remove and .add as follows

   script.
      var btn = document.getElementById('button');
      var inpt = document.getElementById('textarea');
      inpt.addEventListener("input", function(){
        if (this.value != '') {
          btn.disabled = false;
          btn.classList.remove('butOff');
          console.log(btn);
        } 
        else {
          btn.classList.add('butOff');
          btn.disabled = true;
          console.log('no text present');
        }
      })