10. Code not working as it should


#1


My code has passed but is not working the way I would like it to.

First - the ordered list doesn't count. It keeps displaying 1 instead of counting up. ie) 1. 1st list item 2. 2nd list item 3. 3rd list item etc.

Second - when I try and remove the list item clicked it removes the entire list instead of the line being clicked on.

My code is below. Can anyone help? Thanks in advance


https://www.codecademy.com/en/courses/web-beginner-en-v6phg/2/1?curriculum_id=50a3fad8c7a770b5fd0007a1


$(document).ready(function(){
  $('#button').click(function(){
    var $addTo = $('input[name=checkListItem]').val();
    $('.list').append("<ol><li>" + $addTo + "</li></ol>");
  });
  $('.list').click( function(){
    $(this).remove();
  });
});


#2

I think the question that you've linked to just asks to set up the $(document).ready.

If you want to do what you described, you shouldn't append an ol with it, because that way you're creating a new list (which starts at 1) everytime. You should just append the li.

If you want to remove a certain list item, you should add the click event to li instead of .list


#3

Sorry, I read the instructions wrong. The way the instructions were worded I thought CC wanted us to solve the entire solution on our own. Once I got to steps 11, 12, & 13 it explained everything.

@nicoekkart Thanks for your response. I'm still having trouble with this. I'm feeling all crossed up. Would you be able to provide an example?


#4

I'll show you what your code is doing now:

Let's say you have an empty ordered list in your html like this:

<ol class="list">
</ol>

Whenever it runs this line

$('.list').append("<ol><li>" + $addTo + "</li></ol>");

a new ordered list is inserted INSIDE the .list, so your unordered list becomes:

<ol class="list">
<ol><li>whatever</li></ol>
</ol>

See how append adds inside the element.

So if you only want the li without the ol what should you change?


#5

@nicoekkart Ding! Lightbulb went on. Problem solved. Thanks for your help!


#6

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.