html定时器触发,为什么动态创建的html代码绑定的定时器函数没有触发？

var ele_timer = $(n_tpl).find("#timer");

var n_sec = 0; //秒

var n_min = 0; //分

var n_hour = 0; //时

var n_timer;

var n_tpl = '

' +

'' +

'

' +

'

' +

'翻译人员' +

'结束翻译' +

'

' +

'

' +

'

点对点限时
10分钟

' +

'

hh:mm:ss

' +

'

';

$(document).on("click", ".chat_tit_bar .tranLanguage_icon_on", function() {

var that = $(this);

var r = confirm("确认翻译吗?");

// var clock = $(tpl).find('.s2').text();

if (r == true) {

$(".translator").append(n_tpl);

n_timer = timer();

}

});

//60秒 === 1分

//60分 === 1小时

function timer() {

return setInterval(function() {

var str_sec = n_sec;

var str_min = n_min;

var str_hour = n_hour;

if (n_sec < 10) {

str_sec = "0" + n_sec;

}

if (n_min < 10) {

str_min = "0" + n_min;

}

if (n_hour < 10) {

str_hour = "0" + n_hour;

}

var time = str_hour + ":" + str_min + ":" + str_sec;

ele_timer.text(time);

n_sec++;

if (n_sec > 59) {

n_sec = 0;

n_min++;

}

if (n_min > 59) {

n_sec = 0;

n_hour++;

}

if (str_min == "01") {

console.log(str_min + '分钟');

// $("#pause").trigger("click");

clearInterval(n_timer);

}

}, 1000);

}

现在的情况是

hh:mm:ss

不动态加载直接初始化对象var n_timer = timer();可以触发timer()，动态的就不行，是什么原因？