index.js

let string="";
let buttons=document.querySelectorAll(".button");
let zero=document.querySelector(".zero");
let clickCount=0;
Array.from(buttons).forEach((button)=>{
    button.addEventListener("click",(e)=>{
        try{
            if(e.target.innerText=="="){
                string=eval(string);
                (document.querySelector(".row .input")).value=string;
                
            }
            else if(e.target.innerText=="( )"){
                clickCount++;
                if (clickCount%2==0){
                    string=string+")";
                }
                else{
                    string=string+"(";
                }
                
                (document.querySelector(".row .input")).value=string;
            }
    
            else if(e.target.innerText=="C"){
                string='';
                (document.querySelector(".row .input")).value=string;
            }
            else if(e.target.innerText=="X"){
                string=string+"*";
                (document.querySelector(".row .input")).value=string;
            }
            else{
                console.log('Clicked');
                string=string+(e.target.innerText);
                console.log(string);
                (document.querySelector(".row .input")).value=string;
            }
        }
        catch(e){
            let inputElement = document.querySelector(".row .input");
            inputElement.value = "INVALID"; 
            if (inputElement.value=="INVALID"){// Set the value
                inputElement.classList.add("red");
            }
        }
    })
})

zero.addEventListener("click",(e)=>{
    string=string+(e.target.innerText);
    (document.querySelector(".row .input")).value=string;
})