javascript - dynamically populate images in order with shared class in JS -

i have below, mark-up wise. , have image folder thumb images in order within 'thumb1, thumb2, thumb3' etc (but 100). populate starting 'thumb1' first instance populate first instance of thumb class , downward, 2,3,4 etc - without touching mark-up. can done js, can order detected; first instance = thumb1?

<div class="thumb"></div> <div class="thumb"></div> <div class="thumb"></div> <div class="thumb"></div> <div class="thumb"></div> <div class="thumb"></div> <div class="thumb"></div> <div class="thumb"></div> <div class="thumb"></div> <div class="thumb"></div> 

assuming path thumbnails static , known can this:

$('.thumb').each(function(index){     var src = 'path/to/img/thumb' + index+1;     var $img = $('<img />').attr('src', src);     $(this).html($img); }); 

• iterate on every div class thumbnail
• use index of element refer image (+1 because index starting @ 0)
• adding new img-element div path set

instead of .html() can use .append() or .prepend() add img div.

demo

---

reference

.each()