Как сделать так, чтобы после добавления текста можно было его ещё и удалить? (Код представлен ниже)

Question

подскажите, что добавить в код, чтобы после создания заметки можно было её ещё и удалить? Заранее спасибо за ответ))

<body> 
<head> 
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' /> 
<script src='http://code.jquery.com/jquery-latest.js'></script> 
<!— 
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script> 
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script> 
--> 
<script type='text/javascript'> 
 
 
function validate_form(){ 
 var name=$('#contact_name').val(); 
 if (name=='') { 
 } else { 
 $('#names').append('<p>'+name+'</p>'); 
 }; 
 return false; 
} 
</script> 
</head> 
<p></p> 
<hr></hr> 
<body> 
 <h4>Заметки:</h4> 
<div id='names'></div> 
<div class="popup"> 
 <div class="block"> 
 <form name="contact_form" onsubmit="return validate_form();"> 
<p></p> 
 <input type="text" name="contact_name" id="contact_name" placeholder="Добавить текст"><br> 
 <p></p> 
 
 <input type="submit" value="Добавить"> 
 </form> 
 </div> 
</div> 
</body>

Answer 1

Надеюсь помог

function validate_form() {
  var name = $('#contact_name').val();
  if (name == '') {} else {
    $('#names').append('<p>' + name + '<button onclick=$(this).parent("p").remove();>X</button></p>');
  };
  return false;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p></p>
<hr>
<h4>Заметки:</h4>
<div id='names'></div>
<div class="popup">
  <div class="block">
    <form name="contact_form" onsubmit="return validate_form();">
      <p></p>
      <input type="text" name="contact_name" id="contact_name" placeholder="Добавить текст"><br>
      <p></p>

      <input type="submit" value="Добавить">
    </form>
  </div>
</div>

БЛОГ НА HUSL

Как сделать так, чтобы после добавления текста можно было его ещё и удалить? (Код представлен ниже)

Ответы (1 шт):