differences between prepend and appendchild

Question

I inserted a new row to my list and this is my code

 function newToDo() {
 var newTODoList = document.getElementById('toDoListInput');
 var newLine = document.createElement('li');
 var list = document.getElementById('list');
 newLine.textContent = newTODoList.value;
 newLine.class = 'newLineClass';
 list.prepend(newLine);

when I used appendchild instead of prepend my code didn't work correctly... what is diffrences between them?

Does this answer your question? [JavaScript append and prepend vs jQuery append and prepend](https://stackoverflow.com/questions/45408796/javascript-append-and-prepend-vs-jquery-append-and-prepend) — Rush W., May 17 '20 at 10:19

score 3 · Answer 1 · answered May 17 '20 at 10:12

prepend add item frond of list. append add item end of list. In snipped there is an example

$('div')
    .append('<span>Append</span>')
    .prepend('<span>Prepend</span>')
    .before('<span>Before</span>')
    .after('<span>After</span>');

div {
  border:2px solid #bbb;
  padding:10px;
  margin:10px auto;
}

span {
  display:block;
  width:65px;
  font:bold 12px Arial,Sans-Serif;
  color:white;
  padding:5px 10px;
  background-color:gray;    
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>-------content---------</div>

Thanks alot... this example makes it easy to understand – Fatemeh Azizkhani May 18 '20 at 04:13 — Fatemeh Azizkhani, May 18 '20 at 04:13

differences between prepend and appendchild

1 Answers1

Linked

Related