Difficulty adding object as innerHTML to a dynamically created div in javascript/jquery

Question

I have below code in my project

HTML:

Answer 1

You can use jQuery's grep function which is intended for searching an array.

function getObjContents(i){
  var arr = $.grep(input, function(e){ 
    return e.id == i; 
  });
  var str="";
  for (var i = 0; i < arr[0].st.length; i++) {
    str += JSON.stringify(arr[0].st[i]);
  }
  return str;
}

You would call it like this:

$( "<div id='sp"+array[i]+"'>This is div with id "+array[i]+getObjContents(Num)+"<div class='st'></div></div>" ).insertAfter( "#main");

Demo