Javascript 如何使用div'；是在jQuery.each（）上的吗？

我试图建立一个照片库，从flickr中提取照片，并用文本框显示每张照片。我想要下面的代码，其中div class='col-sm-6 col-md-4 center'和所有子关系在div class='row'中重复

标签！

我使用的Javascript是：

<script>
 (function() {
  var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
  var tagForm = "<span class='input-group-btn'><button class='btn btn-default' type='button'>Tag!</button></span>";

  $.getJSON( flickerAPI, {
   tags: "porsche",
   tagmode: "any",
   format: "json"
  })
  .done(function( data ) {
   $.each( data.items, function( i, item ) {
    $( "<img>" ).attr( "src", item.media.m ).appendTo( "#gallery" );
    $( "#gallery" ).append( tagForm );
    if ( i == 5 ) {
     return false;
    }
   });
  });
 })();
</script>

（功能（）{
var flickerAPI=”http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
var tagForm=“Tag！”；
$.getJSON（flickeAPI{
标签：“保时捷”，
tagmode:“任何”，
格式：“json”
})
.完成（功能（数据）{
$.each（data.items，function（i，item）{
$( "

这将拉动照片，但文本框和按钮将位于照片的右侧，而不是下方。我知道问题出在前两个部分没有包括在内，但是，我不知道如何将照片和文本框/按钮嵌入缩略图和col-sm-6中

---

任何帮助都将是令人惊奇的！提前感谢。

前提是您希望每个图像进入“多媒体资料”并带有自己的标记按钮 如果将图像和跨距分组到一个元素中，将更容易设置样式

示例输出：

<div class="gallery">
    <div class="img-box">
        <img src="something.jpg">
        <span class='input-group-btn'><button class='btn btn-default' type='button'>Tag!</button></span>
    </div>
</div>

标签！

---

（功能（）{
var flickerAPI=”http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
var tagForm=“Tag！”；
//存储它，这样我们就不会每次迭代都查找它
var$gallery=$（“#gallery”）；
$.getJSON（flickeAPI{
标签：“保时捷”，
tagmode:“任何”，
格式：“json”
})
.成功（功能（数据）{
$.each（data.items，function（i，item）{
//创建一个div来填充img和tag
var$img_box=$（''）；
$( "

你能告诉我们你希望最终得到的结构吗？@JasonP我编辑了这个问题。这有帮助吗？谢谢你花时间。你想在“画廊”里放6张图片还是整个…区块为每张图片重复？我想让整个…为每张图片重复。太棒了！非常感谢！我坚持了24小时没有w:/

<div class="gallery">
    <div class="img-box">
        <img src="something.jpg">
        <span class='input-group-btn'><button class='btn btn-default' type='button'>Tag!</button></span>
    </div>
</div>

<script>
 (function() {

  var flickerAPI = "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?";
  var tagForm = "<span class='input-group-btn'><button class='btn btn-default' type='button'>Tag!</button></span>";
  // store this so we dont look it up every iteration
  var $gallery = $("#gallery");

  $.getJSON( flickerAPI, {
   tags: "porsche",
   tagmode: "any",
   format: "json"
  })
  .success(function( data ) {
   $.each( data.items, function( i, item ) {
        // create a div to stuff img and tag in
        var $img_box = $('<div class="img-box">');    
        $( "<img>" ).attr( "src", item.media.m ).appendTo( $img_box );
        $img_box.append( tagForm ).appendTo($gallery)
    if ( i == 5 ) {
     return false;
    }
   });
  });
 })();
</script>