Я делаю веб приложение To Do List, уже сделал генерацию новых задач при их вводе, но я не очень знаю JS, по этому, погите, пожалуйста :3 Мне надо сделать вместе с задачами генерировались 2 кнопки справа от задачи, одна из которых будет удалять задачу, а вторая - редактировать.
Вот HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ToDo List</title>
<script src="eel.js"></script>
<script src="main.js" type="text/javascript"></script>
<link rel="icon" type="image/png" href="/favicon.png">
<link rel="stylesheet" href="main.css">
</head>
<body>
<div class="wrapper">
<h1>Список дел</h1>
<div id="add">
<form>
<input type="text" value="" name="" id="txt1">
<input type="button" value="Добавить" onclick="butt();">
</form>
</div>
</div>
<div class="container"></div>
</body>
</html>
CSS код:
body {
background: #c2e59c; /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #c2e59c, #64b3f4); /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #c2e59c, #64b3f4); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.wrapper {
display: flex;
flex-direction: column;
align-items: center;
font-family: "Roboto", sans-serif;
}
#txt2 {
margin-top: 60px;
margin-right: 40px;
font-family: "Roboto", sans-serif;
}
.container {
margin-top: 48px;
margin-right: 15px;
}
Вот JS:
function butt() {
let cont = document.querySelector(".container");
let item = document.createElement("div");
item.className = 'txt2';
item.textContent = document.getElementById("txt1").value;
cont.appendChild(item);
}
Заранее большое спасибо!