how to click to add parent class in javascript??

Question

i use dynamically add li when i type in inputbox..it automatically add but when i close to close button in li it not working...

 

here is my code

<div class="to-do">
<input type="text" id="candidate"/>
<button onclick="addItem()">add</button>
<ul id="dynamic-list"></ul>
</div>
<script>
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);
var button = document.createElement("button");
li.appendChild(button);
button.classList.add("mystyle");
}
</script>