html - Create button in declared variable using javascript -

i have set of images faded out , faded in i.e when image selected others become faded. working. whenever image selected information picture shown beside list of images. working. @ present need button in text different every picture. can 1 guide me how this? text, in script there variable contains text array, like-

var line = [{     "caption": "violet",     "content": "it 1st color of vibgyor.", }, {     "caption": "blue",     "content": "it third color of vibgyor." }, {     "caption": "orange",     "content": "it sixth color of vibgyor." }] 

and function is:

function motionstart(e, data) {     $(".title, .text", this).hide().removeclass('animated fadeindown fadeinup'); }  function motionend(e, data) {      var text = line[data.index % line.length];     $(".title, .text", this).show();      $(".title", this).text(text.caption).addclass('animated fadeindown');     $(".text", this).text(text.content).addclass('animated fadeinup'); }  function carouselcreated(e, data) {     motionend.call(this, e, data) } 

i want insert document.write('<button type="button">click me!</button>') each. after clicking button show page. please if possible.

i see using jquery.

you can use:

var button = $('<button type="button">' + somejsvar + '</button>'); 

then append dom:

$('body').append(button);