Interactive card details form solution with custom js, css html

For doing real time Updating you have to target the form input field and the text in card, use the event of "onkeyup",and set the input box value to the text in form value. For example: <input type="text" id="card-number" onkeyup="display1()"> // This is for your Input Section <span id="num">0000 0000 0000 0000</span> // This for your card //Now in JS define the function display1() function display1() { var cnum=document.getElementById.("card-number").value; //This will take the value from input box document.getElementById.("num").innerHTML=cnum; //This will change the value in real-time } //