doT.js模板插件，与tab选项卡一起使用时，出现的JS报错，求帮忙看看什么问题

Question

前端使用了doT.js模板插件来去解析jQuery ajax返回的数据，并根据需求在页面中使用了YDUI移动端的的UI中的tab选项卡。相关代码如下

    $tab.find('.tab-nav-item').on('open.ydui.tab', function (e) {
        if(e.index == '0'){
            device_info_1();
        }else if(e.index == '1'){
            device_info_2();
        }else if(e.index == '2'){
            device_info_3(1);
        }
    });

以上是tab选项卡的JS，切换的时候触发不同的方法，每个方法中都是一个jQuery ajax来调取数据

jQuery ajax的方法如下，举其中一个例子，他的两个类似，只是调的数据内容不同而已

    function device_info_1() {
            $.ajax({
                type: "GET",
                cache:false,
                url: "api接口地址",
                dataType: "json",
                timeout: 3000,
                success: function(data) {
                    if (data.code == '0000') {
                        // doT的模板方法
                        var tmpText = document.getElementById("list-tmpl-1").innerHTML;
                        document.getElementById("list-con-1").innerHTML=doT.template(tmpText)(data);

                    }else {
                        YDUI.dialog.alert(data.desc);
                    }
                },
                error: function(data) {
                    $('#list-con-1').html('<a href="javascript:device_info_1();" class="no-content">设备信息加载失败，点击重新加载</a>');
                }
            });
    }

现在的问题是：有tab选项卡有3个，在初始加载，和第一次点击切换的时候，都能正常加载数据，js也不报错，
但是如果3个tab都点击查看完毕之后，再切换其他的tab选项卡，js就会出现如下报错，请问这是什么原因呢？

很奇怪，为何每个选项卡切换第二次的时候，就出现说innerHTML为null呢？

下面的gif应该看的更清楚一些，这到底是什么问题呢？求解，谢谢~

Answer 1

突然发现问题所在了，我把id为list-tmpl-1的script写在了id是list-con-1的元素之内了~只要放在list-con-1之外就好了