Question

这个问题让我疯了。我有这个HTML：

<div class="matchup-container">
    <div class="gamequestion">
        <strong>Who will win?</strong>
    </div>
    <table class="mg-gametableQ">
        <tbody>
            <tr>
                <td class="mg-column1 start">
                    <div class="matchupDate">
                        <span class="startTime">11:00 AM</span>
                    </div>
                </td>
                <td class="mg-column3 opponents  ">
                    <span>
                        <strong>
                            <a href="link">Team</a>: Win
                        </strong>
                    </span>
                </td>
            </tr>
            <tr>
                <td class="mg-column1 start">
                    <div class="matchupDate">
                        <span class="startTime">11:00 AM</span>
                    </div>
                </td>
                <td class="mg-column3 opponents   otherthings">
                    <span>
                        <strong>
                            <a href="link">Team</a>: Win
                        </strong>
                    </span>
                </td>
            </tr>
        </tbody>
    </table>
</div>

我知道这很乱，但这是我正在做的事情。所以不止一个matchup-container。我想在页面上遍历所有这些内容，使用包含td的类进入mg-column3，并将一些文本附加到Team：Win部分。我的JavaScript / jQuery如下：

$('.matchup-container').each(function() {
    $(this).find('.mg-column3').each(function () {
        var span = document.createElement("span");
        var text = document.createTextNode("APPENDED TEXT");
        span.appendChild(text); 
        $(this).append(span);
    });
});

但这并不奏效。我知道它必须与HTML的荒谬嵌套有关，但我无法弄清楚我的生活。我尝试了一些不同的方法来找到没有运气的课程。这是JSFiddle。有人可以帮忙吗？

Answer 1

起初你没有在你的jsfiddle中包含jQuery lib。

第二：为什么不使用jQuery lib来创建Elements。 - ＆GT;减少模糊。

这很有效 http://jsfiddle.net/qM9js/

;(function ($) {
    $(function () {
        $('.matchup-container').each(function () {
            $('.mg-column3', this).each(function () {
                alert(2)
                $(this).append('<span>' + "APPENDED TEXT" + '</span>');
            });
        });
    });
}(jQuery));

使用jQuery将HTML附加到表格单元格中

1 个答案: