Knockout js自定义绑定

我正在使用Knockout js自定义绑定来绑定div内的一些新的div元素，使用类和我从数据库中获取数据，它只适用于单个数据，如果数据多于一个，它再次获得绑定在相同的div内像我下面的代码，

 //for single data it working 
<div data-bind="foreach:items">
  <ul data-role="listview">
  <li>
     <div databind="BindingImage({img:imageurl})" class="Image">
        <div id="img1"><img src=1.png /></div>
     </div>
  </li>
  </ul>
</div>
//for multiple data it not  working 
<div data-bind="foreach:items">
  <ul data-role="listview">
  <li>
    <div databind="BindingImage({img:imageurl})"class="Image">
        <div class="imageWrapper" id="img1"><img src=1.png /></div>
        <div clas="imageWrapper" id="img2"><img src=2.png /></div>
   </div>
        for multiple data its create databind="BindingImage div, but inside the div it does not bind anything, i need to bind image2 in this div but its getting bind on first  div itself,i need to bind first image inside the first BindingImage div and next  one in another BindingImage div where i am doing wrong. 
   <div databind="BindingImage({img:imageurl})"class="Image"></div>
  </li>
  </ul>
</div>

//custom binding//
ko.bindingHandlers.BindingImage = { 
    update: function(element, valueAccessor) {
        id+=1
        var className = element.className;
        imagewrapper= document.createElement('div');
        imagewrapper.className = "imageWrapper";
        imagewrapper.id = "img1"+id
        document.querySelector("." +className).appendChild(imagewrapper)
    }
};