Jquery click function not recognized

Question

im trying to generate a element dynamically and bind the element to a click event using the below code..Everything works fine but the click event is not being triggered when I click datasource.

function create_datasource_facet(facetcount){
        console.log(JSON.stringify(facetcount))
        $('#filters').append('<div id="datafacet"></div>')
        $.each(facetcount,function(index,value){
                console.log(value);
                console.log(index);
                $('#datafacet').append('<br>')
                $('#datafacet').append('<div id="datasource">' + index + '[' + value + ']  </div>')
                //$('#datafacet').append('<br>')

        })

$(document).on('click','#datssource',function(){ alert('datasource clicked')})

}

Spelling mistake in $(document).on('click','#datssource',function() — AmanVirdi
– AmanVirdi, Commented Sep 23, 2014 at 15:09
also note that even though javascript has ASI, strict browsers can make problems with that. so better close everything with semicolons just to be on the safe side. — Banana
– Banana, Commented Sep 23, 2014 at 15:11

isherwood · Accepted Answer · 2014-09-23 15:09:11Z

1

You have a typo in the ID value here:

$(document).on('click','#datssource',function(){ alert('datasource clicked')})
----------------------------^

answered Sep 23, 2014 at 15:09

isherwood

61.4k16 gold badges122 silver badges173 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Joe · Accepted Answer · 2014-09-23 15:14:44Z

1

You've misspelt #datasource in your click event handler.

One thing to be aware of is that you're potentially trying to append multiple elements with the id '#datasource'. IDs should be unique, so you're probably better off making this into a class .datasource.

edited Sep 23, 2014 at 15:14

answered Sep 23, 2014 at 15:09

Joe

15.8k4 gold badges52 silver badges84 bronze badges

2 Comments

Joe Over a year ago

@isherwood this is true. Removed that, and added in a note about duplicate IDs which he is likely to run into

isherwood Over a year ago

I didn't catch the duplicate IDs. Well spotted. OP could also increment the IDs.

Gildas.Tambo · Accepted Answer · 2014-09-23 15:10:17Z

0

click Event on #datasource not #datssource

function create_datasource_facet(facetcount){
        console.log(JSON.stringify(facetcount))
        $('#filters').append('<div id="datafacet"></div>')
        $.each(facetcount,function(index,value){
                console.log(value);
                console.log(index);
                $('#datafacet').append('<br>')
                $('#datafacet').append('<div id="datasource">' + index + '[' + value + ']  </div>')
                //$('#datafacet').append('<br>')

        })

$(document).on('click','#datasource',function(){ alert('datasource clicked')})

}

answered Sep 23, 2014 at 15:10

Gildas.Tambo

22.7k7 gold badges53 silver badges79 bronze badges

1 Comment

isherwood Over a year ago

You've misspelled the ID value, too. :-)

vmontanheiro · Accepted Answer · 2014-11-06 13:25:59Z

0

Think that your code is load before the document is loaded.

try it

$('#datssource').on('click',function(){ alert('datasource clicked')})

}

answered Nov 6, 2014 at 13:25

vmontanheiro

1,0399 silver badges14 bronze badges

Collectives™ on Stack Overflow

Jquery click function not recognized

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related