[英]Append HTML into table cell using jQuery
This problem is driving me nuts. 这个问题使我发疯。 I have this HTML:
我有这个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>
I know it's a mess, but it's what I'm working with. 我知道那是一团糟,但这是我正在使用的。 So there's more than one
matchup-container
. 因此,有不止一个
matchup-container
。 I want to loop through all of them on the page, get down to the td
with class containing mg-column3
, and append some text to the Team: Win part. 我想遍历页面上的所有内容,并通过包含
mg-column3
类进入td
,并将一些文本添加到Team:Win部分。 My JavaScript/jQuery is as follows: 我的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);
});
});
But that doesn't work. 但这是行不通的。 I know it must have to do with the ridiculous nesting of the HTML, but I can't figure it out for the life of me.
我知道它一定与HTML的可笑嵌套有关,但是我无法一辈子搞清楚。 I've tried a bunch of different ways of finding the class with no luck.
我尝试了很多不同的方法来找到没有运气的课程。 Here's the JSFiddle .
这是JSFiddle 。 Can anyone help?
有人可以帮忙吗?
At first you did not include the jQuery lib in you jsfiddle. 最初,您没有在jsfiddle中包含jQuery库。
Second: Why not use the jQuery lib to create Elements. 第二:为什么不使用jQuery库创建Elements。 --> Less fuzz.
->减少绒毛。
This works http://jsfiddle.net/qM9js/ 这适用于http://jsfiddle.net/qM9js/
;(function ($) {
$(function () {
$('.matchup-container').each(function () {
$('.mg-column3', this).each(function () {
alert(2)
$(this).append('<span>' + "APPENDED TEXT" + '</span>');
});
});
});
}(jQuery));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.