JSFiddle - React, Tailwind, and code Playground

by Santosh Mungle

HTML

Bidders:<br> 
<br>   
Name: <input type="text" id="name" class="input" placeholder="Type Name of Bidder" > <br> 
<br>    
Email: <input type="email" id="email" class="input" placeholder="[email protected]">   
<br>
<br> 
<input type='button' onclick='changeText2()'   value='Add'/> 
<br>
<br>    
<br>    
Bidders: <br>    

<p> Name: </p>

<ol id="demo"> 
</ol>
    
<p> Email: </p>
<ol id="demo1">
</ol>

CSS

.highlight {
    background-color: red;
}

JavaScript

function changeText2(){
var name = document.getElementById('name').value;
var email = document.getElementById('email').value;    
var node1=document.createElement("LI");
var node2=document.createElement("LI");    
var textnode=document.createTextNode(name);  
var textnode1=document.createTextNode(email);      
node1.appendChild(textnode);
node2.appendChild(textnode1);    
document.getElementById("demo").appendChild(node1);  
document.getElementById("demo1").appendChild(node2);     
 }