如何使用jQuery或Javascript添加元素

Question

I want to know how to add an HTML element with jQuery or Javascript after another element

for example, from this

<ul>
<li> .... </li>
<li> .... </li>
<li> .... </li>
</ul>

to this

<ul>
<li> .... </li>
<div>..</div>
<li> .... </li>
<div>..</div>
<li> .... </li>
<div>..</div>
</ul>

Answer 1

You can not append a div as a child of a UL so no you can not add the div element after the li . The browser will "fix" your bad HTML the best as it can and not every browser will do the same thing.

If you append and li that has a div as a child, it will work correctly.

 $("li").after("<li><div>New</div></li>"); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <ul> <li> .... </li> <li> .... </li> <li> .... </li> </ul>