1

次の HTML 構造が与えられ、変更することはできません。 

<div id="cone" class="team">
  <div class="default"></div>
  ...
  <div class="default">
    <img src="img.jpg" width="271" height="271" alt="" border="0"> First Text line<br> Second text line (optional)
    <img src="img.jpg" width="271" height="271" alt="" border="0"> First Text line<br> Second text line (optional) ...
  </div>
</div>

jQueryを使用して次の結果を取得したい:

<div id="cone" class="team">
  <div class="default"></div>
  ...
  <div class="default">
    <img src="img.jpg" width="271" height="271" alt="" border="0">
    <div class="desc">
      First Text line<br> Second text line (optional)
    </div>
    <img src="img.jpg" width="271" height="271" alt="" border="0">
    <div class="desc">
      First Text line<br> Second text line (optional)
    </div>
    ...
  </div>
</div>

私が試してみました：

$(".team img").each(function () {
    $(this.nextSibling).wrap('<div class="desc"></div>');
});

ただし、これは最初の行のみをラップします。

<img src="fileadmin/dateien/bilder/team/platzhalter_team.jpg" width="271" height="271" alt="" border="0">
<div class="desc">First Text line</div>
<br>
Second text line (optional)

重要:<img>タグの後に 1 行、2 行、または 3 行のテキストを含めることができます。

4

2 に答える 2