Как добавить DIV к ул динамически

-2

мне нужно после HTML, как показано ниже как присутствующая в этом ниже скрипкуКак добавить DIV к ул динамически

<h3>Test <a class="icon-pencil-1 labelEditIcon"></a></h3> 

<ul data-role="listview" class="labellistUL">         
    <li class="labellist"> 
     <div class="leftlable"> 
      <h4>Rayalaseema Ruchulu</h4> 

      <p>Area Name, <b>Phone:</b> +91 99890 11223</p> 
      <p><b>Timings:</b> 11am - 2pm</p> 
      <p class="minOrder">Min. Order Rs. 250/- Delivery Charges Free</p> 
      <label class="label-red label-wrap">Close</label> 
     </div> 
     <div class="rightlable"> <a href="#">Remove</a> 

     </div> 
    </li> 
    <div class="label-BtnWrap"> 
     <button class="icon-plus btn btn-c">Add More</button> 
    </div>  
</ul>

Я способен генерировать следующий HTML

http://jsfiddle.net/m5f9c877/

<h3>Test<a class="icon-pencil-1 labelEditIcon"></a></h3> 
<ul data-role="listview" class="labellistUL"></ul> 
<li class="labellist"> 
    <div class="leftlable"> 
     <h4>Rayalaseema Ruchulu</h4> 
     <p>Area Name, <b>Phone:</b> +91 99890 11223</p> 
     <p><b>Timings:</b> 11am - 2pm</p> 
     <p class="minOrder">Min. Order Rs. 250/- Delivery Charges Free</p> 
     <label class="label-red label-wrap">Close</label> 
    </div> 
    <div class="rightlable"> 
     <a href="#">Remove</a> 
    </div> 
</li> 
</ul>

Но тем не менее я не в состоянии поставить следующий DIV перед уль тегом

<div class="label-BtnWrap"> 
     <button class="icon-plus btn btn-c">Add More</button> 
    </div>  

Could you please let me know how to do this ??

источник

2015-01-31 Kiran

уль должны иметь Li элементы. –

Я тоже согласен, но это то, что мне дал парень css pers. Я не смог поставить этот div перед тегом ul. – Kiran

НО это недопустимая разметка HTML –

Manual

var btn = '<div class="label-BtnWrap"><button class="icon-plus btn btn-c">Add More</button></div>';  
$("ul.labellistUL li:last-child").after(btn);

Demo

источник

2015-01-31 12:25:42 Sadikhasan

Спасибо, но добавление больше появляется сверху, см. Эту скрипку http://jsfiddle.net/7j61bxbv/ – Kiran

Где вы хотите поставить 'кнопку' перед меткой' Test'? или Дать ожидаемый результат с кодом 'HTML' – Sadikhasan

После последнего тега li и до конца тега ul, как показано в этом скрипте jsfiddle.net/7j61bxbv – Kiran

Это не JQuery ... чисто Javascript с HTML concat ... Я полагаю, вы получаете то, что хотите удалить </ul> в var html = '<h3>Test<a class="icon-pencil-1 labelEditIcon"></a></h3><ul data-role="listview" class="labellistUL"></ul>';, потому что вы concat </ul> в html += '</ul>'

Но для решения JQuery вас лучше всего:

var ulElement = $('ul.labellistUL'); 

for(var i=0;i<response.length;i++) 
{ 
var vendor_id = response[i].vendor_id; 
if(vendor_id) 
{ 
    var liToAdd = $('<li class="labellist"> 
     <div class="leftlable"> 
     <h4>Rayalaseema Ruchulu</h4> 
     <p>Area Name, <b>Phone:</b> +91 99890 11223</p> 
     <p><b>Timings:</b> 11am - 2pm</p> 
     <p class="minOrder">Min. Order Rs. 250/- Delivery Charges Free</p> 
     <label class="label-red label-wrap">Close</label>\n\ 
     </div> 
     <div class="rightlable"> 
     <a href="#">Remove</a> 
     </div> 
     </li>'); 

    ulElement.append(liToAdd); 
} 
}

источник

2015-01-31 12:33:25

Как добавить DIV к ул динамически

ответ

Смежные вопросы