Note that there are some explanatory texts on larger screens.

plurals
  1. POadding li to ul using jquery works just one time
    text
    copied!<p>I have a page with a link in it , when pressing the link I want to add new LI to UL using jQuery, I created my jQuery function and it works just one time, I mean, jQuery function works for just on click </p> <h1>jquery</h1> <pre><code>$("#addRelation").ready(function (){ $("#addRelation a").css("padding","6px"); $("#addRelation .araNew").bind('click',function(){ $("#addRelation .araNew").hide(); $("#addRelation ul li:last").append('&lt;li&gt; \n\ &lt;p&gt;\n\ &lt;label&gt;Source&lt;/label&gt;\n\ &lt;select name="source[]" id="source"&gt;\n\ &lt;option&gt;select source&lt;/option&gt;\n\ &lt;/select&gt;\n\ &lt;/p&gt;\n\ &lt;p&gt;\n\ &lt;label&gt;Destination&lt;/label&gt;\n\ &lt;select name="destination[]" id="destination"&gt;\n\ &lt;option&gt;select destination&lt;/option&gt;\n\ &lt;/select&gt;\n\ &lt;/p&gt;\n\ &lt;p&gt;\n\ &lt;a href="#" class="araNew"&gt;new&lt;/a&gt; \n\ &lt;a href="#" class="araDel"&gt;delete&lt;/a&gt; \n\ &lt;/p&gt;\n\ &lt;/li&gt;'); }); </code></pre> <h1>html</h1> <pre><code>&lt;div class="container" id="addRelation"&gt; &lt;ul class="containerUL"&gt; &lt;li class="containerLI"&gt; &lt;label&gt;Name&lt;/label&gt; &lt;input type="text" name="relationName" class="longInput1"/&gt; &lt;div id="arSuggestions"&gt;&lt;/div&gt; &lt;/li&gt; &lt;li&gt; &lt;label&gt;Related Concepts&lt;/label&gt; &lt;p&gt; &lt;label&gt;Source&lt;/label&gt; &lt;select name="source[]" id="source"&gt; &lt;option&gt;select source&lt;/option&gt; &lt;/select&gt; &lt;/p&gt; &lt;p&gt; &lt;label&gt;Destination&lt;/label&gt; &lt;select name="destination[]" id="destination"&gt; &lt;option&gt;select destination&lt;/option&gt; &lt;/select&gt; &lt;/p&gt; &lt;p&gt; &lt;a href="#" class="araNew"&gt;new&lt;/a&gt; &lt;a href="" class="araDel"&gt;delete&lt;/a&gt; &lt;/p&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre> <p>and also any suggestions for adding li to ul different from my function?</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload