javascript - Prepending template to img inside div -

i need dynamically put template above static img, located in div. more precised after run function template(){} twice want html code one:

   <div class="main">            <div id="templateid"></div>            <div id="templateid"></div>            <img src="~/content/img/preload.gif" id="gifload"/>     </div> 

before run html looks this:

  <div class="main">     <img src="~/content/img/preload.gif" id="gifload"/> </div> 

after running function template(){} twice html looks this:

<div class="main">   <img src="~/content/img/preload.gif" id="gifload"/>    <div id="templateid"></div>   <div id="templateid"></div> </div> 

the function suppose add template above img looks this.

function template(data) {         var parent = $('.main');          var template = '<div id="templateid"></div>';          var parent2 = $('#gifload');         $('template').prependto(parent2);          parent.append(template);      })  } 

can me out please?

the issue is:

• .append() appends data, end of element.
• .prepend() prepends data, start of element.

use .prepend() instead of .append():

parent.prepend(template); 

and also, not idea duplicate ids, meant unique. better change elementid before prepending data.