var ulListElement = document.querySelector('ul.todo-list');
// var ulListElement = document.querySelectorAll('li.todo-list-element');

//node list
var ulListElementNodes = ulListElement.childNodes;

//html collection list
var ulListElementChildren = ulListElement.children;

console.log('Printing the Ul List');
console.log(ulListElement);

console.log('Printing the Ul list with Child Nodes');
console.log(ulListElementNodes);

console.log('Printing the Ul list with Children');
console.log(ulListElementChildren);

console.log('First And Last Children');
var fChild = ulListElement.firstElementChild;
var lChild = ulListElement.lastElementChild;
console.log(fChild);
console.log(lChild);

console.log('Printing out the Node Element Child with for loop');

for(var i = 0; i<ulListElementNodes.length ; i++){
    console.log(ulListElementNodes[i].nodeName + " " +ulListElementNodes[i].nodeType);
}
//Parent Nodes
console.log('Printing The Parent Node of Ul List');
console.log(ulListElement.parentNode);
// console.log(ulListElement.parentElement);
console.log('Printing The Parent Of list wrapper node');
console.log(ulListElement.parentNode.parentNode);
console.log('Printing The Parent Of card-body node');
console.log(ulListElement.parentNode.parentNode.parentNode);
console.log('Printing the Prev And Next Sibling');
var findSiblings = document.querySelector('li.todo-list-element');

console.log(findSiblings.nextElementSibling);
console.log(findSiblings.nextElementSibling.nextElementSibling);
var findSiblingOf2 =findSiblings.nextElementSibling.nextElementSibling;
console.log(findSiblingOf2.previousElementSibling);

console.log('Find tge children of li that are span and a href link');
var liCollection = document.querySelector('li.todo-list-element');
console.log(liCollection); 
console.log(liCollection.children); 
var span = liCollection.children[0];
var link = liCollection.children[1];
console.log('0. The Span Child');
console.log(span);  
console.log('1. The A href Child');
console.log(link);  
console.log('1. Add id to a href link');
console.log(link.id='trash-id');  
