diff --git a/mycss.css b/mycss.css new file mode 100644 index 0000000..e1ded88 --- /dev/null +++ b/mycss.css @@ -0,0 +1,14 @@ +html { + background-color: green; + font-size: 20px; +} + +ul { + background: red; + padding: 10px; + border: 1px solid black; +} + +li { + margin-left: 20px; +} diff --git a/myhtml.html b/myhtml.html new file mode 100644 index 0000000..e332085 --- /dev/null +++ b/myhtml.html @@ -0,0 +1,20 @@ + + + + + + + Dan's Homepage >3< + + + + My test image +

Hi, my name is Dan.

+ + + diff --git a/myjs.js b/myjs.js new file mode 100644 index 0000000..767d384 --- /dev/null +++ b/myjs.js @@ -0,0 +1,21 @@ +const list = document.createElement('ul'); +const info = document.createElement('p'); +const html = document.querySelector('html'); + +info.textContent = 'Below is a dynamic list. Click anywhere on the page to add a new list item. Click an existing list item to change its text to something else.'; + +document.body.appendChild(info); +document.body.appendChild(list); + +html.onclick = function() { + const listItem = document.createElement('li'); + const listContent = prompt('What content do you want the list item to have?'); + listItem.textContent = listContent; + list.appendChild(listItem); + + listItem.onclick = function(e) { + e.stopPropagation(); + const listContent = prompt('Enter new content for your list item'); + this.textContent = listContent; + } +}