add and delete to a list by html javascrip

function addItem(){
    var ul = document.getElementById("dynamic-list");
    var candidate = document.getElementById("candidate");
    var li = document.createElement("li");
    li.setAttribute('id',candidate.value);
    li.appendChild(document.createTextNode(candidate.value));
    ul.appendChild(li);
}

function removeItem(){
    var ul = document.getElementById("dynamic-list");
    var candidate = document.getElementById("candidate");
    var item = document.getElementById(candidate.value);
    ul.removeChild(item);
}

Posted by: Guest on May-23-2020

Source

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Dynamically add/remove items from list - JavaScript</title> </head> <body> <ul id="dynamic-list"></ul> <input type="text" id="candidate"/> <button onclick="addItem()">add item</button> <button onclick="removeItem()">remove item</button> <script src="script.js"></script> </body> </html>

Code answers related to "add and delete to a list by html javascrip"

Code answers related to "Javascript"

Javascript Answers by Framework

Browse Popular Code Answers by Language

Answers for "add and delete to a list by html javascrip"

Code answers related to "add and delete to a list by html javascrip"

Code answers related to "Javascript"

Javascript Answers by Framework

Browse Popular Code Answers by Language

Popular Programming Languages

Advertisements

Company

Compilers

Help

Connect with us