如何将数据添加到动态添加的div？

Question

I'm trying to prepend data to my dynamically added div - here is my code -

<script type="text/javascript">

var addedDiv=0;
$(document).on("submit",".postFromAdd",function(event){
event.preventDefault();
var tmp = "#addedDiv"+addedDiv;
$("#showPostedData").prepend("<div id="+ tmp +"></div>");
// tmp having the id of my dymanically added div ,
//now I want to add some data to this div
//i did like --
$(tmp).prepend("<p>Dynamic data here</p>");
addedDiv++;
});
</script>

but $(tmp).prepend("<p>Dynamic data here</p>"); not working . how can i fix it ?

Answer 1

remove id selector # from variable.

var tmp = "addedDiv"+addedDiv;
$('#'+tmp).prepend("<p>Dynamic data here</p>");

Answer 2

Your selectors are the problem, since the tmp is assigned as the id don't prefix it with # add the id selector when you use it as an selector.

var addedDiv = 0;
$(document).on("submit", ".postFromAdd", function (event) {
    event.preventDefault();
    //no # here
    var tmp = "addedDiv" + addedDiv;
    $("#showPostedData").prepend("<div id=" + tmp + "></div>");
    //add # here
    $('#' + tmp).prepend("<p>Dynamic data here</p>");
    addedDiv++;
});

Answer 3

Updated Code

<script type="text/javascript">

var addedDiv=0;
$(document).on("submit",".postFromAdd",function(event){
         event.preventDefault();
         var $div=$('<div/>',{'id':'#addedDiv'+addedDiv});
         $div.prepend("<p>Dynamic data here</p>");
         $("#showPostedData").prepend($div);         
         addedDiv++;
});
</script>

Answer 4

               $('#'+tmp).html('<p>you can ad text or html here</p>');