=== equals to operation, show hide div based on value

  new task key up is while typing listener in user input. 

this.body.onload is while page load

<script>

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

            var gro = document.querySelector('#gro');

            var g = document.querySelector('#g');

            console.log('here');

            this.body.onload = () => {

                alert('loading is done');

                console.log('there');

                gro.style.display='none';  //hide div

                g.style.display='none';   //hide div

                

            }

        });

        </script>

 newTask.onkeyup = () => {

        if (newTask.value.length > 0) {

                 

               add.disabled = false;

        }

        //    else if (newTask.value.length < 0) {

        //        add.disabled = true;

        //}  

        //  else if

         if (newTask.value === 'grocery')

          {

                add.disabled = true;

                alert(newTask.value);

                gro.style.display = ''; //show div

                g.style.display = '';  //show div

          }

    };