Jquery Click Handler Not Working After Two Times

Question

I am facing a little strange problem. I am using bing translator (http://www.bing.com/widget/translator) and trying to customize it on my own using their API.

Here is my

Answer 1

It seems that Microsoft script changes the HTML structure during the translation process. Because of this you have to use delegation: instead of $("#changeLang a").on("click", handler) you will do $('#changeLang').on("click", "a", handler). Also, your code can be simplified:

var lang;
$('#changeLang').on("click", "a", function (e) {
    var to = $(this).attr('id');
    console.log("Translating from ", lang, " to ", to);
    Microsoft.Translator.Widget.Translate(lang, to);
    lang = to;
});

JSFIDDLE