Member Avatar for poloblue

Good Afternoon,
I'm stuck in the last part of the assignment, can anyone help me out. The assignment is the following: Create an HTML page with a list of four list items (ordered or unordered), and create a text box and button. When the button is clicked, if there is text in the text box, add the text in the text box as a new item in the list. So far I have this implemented.

list
<!DOCTYPE html>
<html>
      <head>
               <title>HTML5 DOM</title>
               <link rel="stylesheet" href="style.css">
     </head>
     <body>

       <div id="h-contain">
<ul>
      <li><strong>Oranges</strong></li>
      <li><strong>Apples</strong></li>
      <li><strong>Pears</strong></li>
</ul>
</div>
<p><strong>Click the button to create a text field.</strong></p>

<button onclick="buttonFunction()"><strong>Click it</strong></button>

<script>
function buttonFunction() {
        var x = document.createElement("INPUT");
        x.setAttribute("type", "text");
        x.setAttribute("value", "E-Commerce");
        document.body.appendChild(x);
  }
</script>
</body>
</html>

for the css file I have this
#h-contain {
list-style-type: disc;
 padding: 5px 5px 5px 5em;
 margin-bottom: 25px;
 }
  • 2 Contributors
  • 2 Replies
  • 100 Views
  • 19 Hours Discussion Span
  • Latest Post Latest Post by poloblue
Member Avatar for JorgeM

Good start and you are close, but it looks like you are a bit confused on the part of the text box and missing a few items. The text box needs to be part of the form already. you dont need to add the text box dynamically. You are only going to add the text that the user types in the text box to your unordered list.

Take a look at this: http://jsfiddle.net/bv8gbxo9/

Member Avatar for poloblue

JorgeM,

Thank you very much for your help.

Thanks

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.