未捕获的语法错误：正在添加 <li> 元素 <ul>

Question

I keep getting an uncaught syntex error which I know usually means your code has a missing closing something. I keep failing to see what it is that I am missing.

The idea of the function is that it extracts the a links ID and Text content and add's it to an un-ordered list.

The links have a class of 'ingredient_add' and the unordered list has an ID of 'ingredientsAdded'.

I can't see what I've missed here.

$(document).ready(function() {
    $('.ingredient_add').click(function() {
        event.preventDefault();
        var id = this.id;
        var value = this.text();
        $('#ingredientsAdded').append("<li id='"+id+"'>"+value+"</li>");
    }); //end add to list
}); // end document ready()

Answer 1

Your syntax looks good. You do need to pass in the event to the function though.

$('.ingredient_add').click(function(event){
event.preventDefault();

Check out Jonathan Lonowskis comment on your .text().

Answer 2

The error you should be getting is Uncaught TypeError: undefined is not a function

$('.ingredient_add').click(function () {
    event.preventDefault();   <-- what is event?

should be

$('.ingredient_add').click(function (event) {
    event.preventDefault();

if you are still getting that error, there is something else going on that is not in your code.

Answer 3

Hello your problem was just a simple mistake.

var value = $(this).text();

Here is a jsfiddle: http://jsfiddle.net/Grimbode/pFLXf/1/

I updated your code. Watch out not to use the same id more than once.

$(document).ready(function(){
var counter = 0;
$('.ingredient_add').click(function(event){
event.preventDefault();
var id = this.id;
var value = $(this).text();
$('#ingredientsAdded').append('<li id="'+id+counter+'">'+value+'</li>');
counter+=1;
}); //end add to list

}); // end document ready()

Answer 4

You missed an argument in click handler function.

$(document).ready(function(){

$('.ingredient_add').click(function(event){
event.preventDefault();
var id = this.id;
var value = this.text();
$('#ingredientsAdded').append("<li id='"+id+"'>"+value+"</li>");

}); //end add to list

}); // end document ready()