Skills Management Interface - Copy this Html, Bootstrap Component to your project

giúp-tôi-thêm-dấu-"X"-để-xóa-1-skill-sau-khi-thêm-khi-người-dùng-muốn.-Ví-dụ-khi-người-dùng-click-add-skill-thì-họ-sẽ-có-1-form-để-nhập-thông-tin-của-skill,-sau-khi-add-xong-thì-nó-sẽ-hiện-lên-giao-diện.-Tôi-muốn-nếu-số-dòng-lớn-hơn-2-thì-cho-phép-dấu-x-để-xóa-skill-từ-dòng-thứ-2.-<div-class="modal-body-p-4">-<form-id="jobForm">-<div-class="row-g-3">-<div-class="col-md-6">-<label-for="jobTitle"-class="form-label">Job-Title</label>-<input-type="text"-class="form-control"-id="jobTitle"-aria-label="Job-Title">-</div>-<div-class="col-md-6">-<label-for="salary"-class="form-label">Salary-Range</label>-<input-type="text"-class="form-control"-id="salary"-aria-label="Salary-Range">-</div>-<div-class="col-12">-<label-for="description"-class="form-label">Job-Description</label>-<textarea-class="form-control"-id="description"-rows="3"-aria-label="Job-Description"></textarea>-</div>-<div-class="col-12">-<h6>Required-Skills</h6>-<div-id="skillsContainer">-<div-class="skill-group-mb-3-animate__animated-animate__fadeIn">-<div-class="row-g-2">-<div-class="col-md-4">-<select-class="form-select-skill-select"-aria-label="Select-Skill">-<option-selected>Select-Skill</option>-<option-value="1">JavaScript</option>-<option-value="2">Python</option>-<option-value="3">Java</option>-</select>-</div>-<div-class="col-md-4">-<select-class="form-select"-aria-label="Skill-Level">-<option-selected>Skill-Level</option>-<option-value="1">Beginner</option>-<option-value="2">Intermediate</option>-<option-value="3">Expert</option>-</select>-</div>-<div-class="col-md-4">-<input-type="text"-class="form-control"-placeholder="Additional-Info"-aria-label="Additional-Information">-</div>-</div>-</div>-</div>-<button-type="button"-class="btn-btn-outline-primary-btn-sm"-id="addSkill">-<i-class="bi-bi-plus-circle"></i>-Add-Another-Skill-</button>-</div>-<!---New-Skill-Form--->-<div-class="col-12-mt-3-d-none"-id="newSkillForm">-<div-class="card">-<div-class="card-header">Add-New-Skill</div>-<div-class="card-body">-<div-class="row-g-3">-<div-class="col-md-6">-<label-for="newSkillName"-class="form-label">Skill-Name</label>-<input-type="text"-class="form-control"-id="newSkillName"-required>-</div>-<div-class="col-md-6">-<label-for="newSkillCategory"-class="form-label">Category</label>-<select-class="form-select"-id="newSkillCategory">-<option-value="0">SOFT_SKILL</option>-<option-value="1">UNSPECIFIED</option>-<option-value="2">TECHNICAL_SKILL</option>-</select>-</div>-<div-class="col-12">-<label-for="newSkillDescription"-class="form-label">Description</label>-<textarea-class="form-control"-id="newSkillDescription"-rows="3"></textarea>-</div>-<div-class="col-12">-<button-type="button"-class="btn-btn-success"-id="saveNewSkill">Add-Skill</button>-<button-type="button"-class="btn-btn-secondary"-id="cancelNewSkill">Cancel</button>-</div>-</div>-</div>-</div>-</div>-</div>-</form>-</div>-đây-là-js:-document.addEventListener("DOMContentLoaded",-function()-{-const-skillsContainer-=-document.getElementById("skillsContainer");-const-addSkillBtn-=-document.getElementById("addSkill");-const-newSkillForm-=-document.getElementById("newSkillForm");-const-saveNewSkillBtn-=-document.getElementById("saveNewSkill");-const-cancelNewSkillBtn-=-document.getElementById("cancelNewSkill");-addSkillBtn.addEventListener("click",-function()-{-newSkillForm.classList.remove("d-none");-});-cancelNewSkillBtn.addEventListener("click",-function()-{-newSkillForm.classList.add("d-none");-document.getElementById("newSkillName").value-=-"";-document.getElementById("newSkillCategory").value-=-"0";-document.getElementById("newSkillDescription").value-=-"";-});-saveNewSkillBtn.addEventListener("click",-function()-{-const-skillName-=-document.getElementById("newSkillName").value;-const-skillCategory-=-document.getElementById("newSkillCategory").value;-const-skillDescription-=-document.getElementById("newSkillDescription").value;-if-(skillName.trim()-===-"")-{-alert("Please-enter-a-skill-name");-return;-}-const-skillSelects-=-document.querySelectorAll(".skill-select");-skillSelects.forEach(select-=>-{-const-option-=-new-Option(skillName,-skillName);-select.add(option);-});-document.getElementById("newSkillName").value-=-"";-document.getElementById("newSkillCategory").value-=-"0";-document.getElementById("newSkillDescription").value-=-"";-newSkillForm.classList.add("d-none");-const-newSkillGroup-=-document.createElement("div");-newSkillGroup.className-=-"skill-group-mb-3-animate__animated-animate__fadeIn";-newSkillGroup.innerHTML-=-`-<div-class="row-g-2">-<div-class="col-md-4">-<select-class="form-select-skill-select"-aria-label="Select-Skill">-<option-selected>Select-Skill</option>-<option-value="1">JavaScript</option>-<option-value="2">Python</option>-<option-value="3">Java</option>-<option-value="${skillName}"-selected>${skillName}</option>-</select>-</div>-<div-class="col-md-4">-<select-class="form-select"-aria-label="Skill-Level">-<option-selected>Skill-Level</option>-<option-value="1">Beginner</option>-<option-value="2">Intermediate</option>-<option-value="3">Expert</option>-</select>-</div>-<div-class="col-md-4">-<input-type="text"-class="form-control"-placeholder="Additional-Info"-aria-label="Additional-Information">-</div>-</div>`;-skillsContainer.appendChild(newSkillGroup);-});-});