Need help with 1 Adding the option to add Due dates to every task 2 Add color codes to each task 3 Add a celebratory message or emoji for when a task is completed Here is my HTML code (with CSS and Javascript) body margin 0 min width 350px Include the padding and border in an element's total width and height box sizing border box Remove margins and padding from the list so that it appears better with the heading ul margin 0 padding 0 Style the list items ul li cursor pointer makes the checkmarks go away if static and not relative position relative padding 10px 6px 10px 30px list style type georgian background FAEBD7 font size 17px transition 0 1s make the list items unselectable webkit user select none moz user select none ms user select none user select none Darker background color on hover ul li hover background DEB887 When clicked on, add a background color and strike out text ul li checked background DEB887 color 000000 text decoration line through Add a checked mark when clicked on ul li checked before content ' ' position absolute border color 000 border style solid border width 0 4px 4px 0 top 12px left 14px transform rotate(55deg) height 15px width 7px Style the close button close position absolute right 0 top 0 padding 10px 14px 10px 14px close hover background color 8B0000 color black Style the header header background color 800000 padding 20px 30px color black text align left Clear floats after the header header after content display block clear both Style the input input margin 0 border solid border radius 1 width 70 padding 10px float left font size 14px Style the Add button addBtn padding 10px width 20 background c9b9b9 color 000 float left text align center font size 14px cursor pointer transition 0 1s border solid border radius 1 addBtn hover background color c79b9b To Do List Add Go to 4 OTF classes this week Finish all class readings review Meal prep Fill out calendar for March Organize room Do 2 loads of laundry this week Create a close button and append it to each list item var myNodelist document getElementsByTagName( LI ) var i for (i 0 i myNodelist length i ) var span document createElement( SPAN ) var txt document createTextNode( u00D7 ) span className close span appendChild(txt) myNodelist i appendChild(span) Click on a close button to hide the current list item var close document getElementsByClassName( close ) var i for (i 0 i close length i ) close i onclick function() var div this parentElement div style display none Add a checked symbol when clicking on a list item var list document querySelector('ul') list addEventListener('click', function(ev) if (ev target tagName 'LI') ev target classList toggle('checked') , false) Create a new list item when clicking on the Add button function newElement() var li document createElement( li ) var inputValue document getElementById( myInput ) value var t document createTextNode(inputValue) li appendChild(t) if (inputValue '') alert( You must write something ) else document getElementById( myL ) appendChild(li) document getElementById( myInput ) value var span document createElement( SPAN ) var txt document createTextNode( u00D7 ) span className close span appendChild(txt) li appendChild(span) for (i 0 i close length i ) close i onclick function() var div this parentElement div style display none

Question: Need help with: 1. Adding the option to add Due dates to every task 2. Add color codes to each task 3. Add a celebratory