CODEWITHSUNDEEP
jqueryasp.net-ajaxjquery-templates
Safran Ali
Safran Ali

Reputation: 4497

How to append a div at the end of jquery template?

I have a jquery template which renders pictures 

<script id="PictureList" type="text/x-jquery-tmpl">

    <ul class="pictureList">

      <li id="AddPicture">
          //an input box with browse button and upload button
      </li>

    </ul>

</script>

i.e. it reads data from DB which returns PictureID and the PicturePath. So whenever the page loads it reads the data and append to pictureList class. Everything is working fine, but the thing is that AddPicture box renders at the very first place and I want it to render at the last place.

I have tried to append it to DOM's Ready event and its working, but it jitters the page and doesn't give right visibility. So can any one help me how to work around this problem and renders AddPicture button at the very end of the list.

Upvotes: 2

Views: 97

Answers (2)

Safran Ali
Safran Ali

Reputation: 4497

I used this

$.tmpl( "Pics", ProfilePics ).insertBefore( $(".pictureList > #AddPicture"));

Upvotes: 1

MikeyObviously
MikeyObviously

Reputation: 39

instead of append you can use prepend(): http://api.jquery.com/prepend

It works like append except puts generated content at the beginning of an element.

Upvotes: 1

Related Questions