Question

Hi all i am working on jquery here i have my html like this
i want to move an image from one div to another div when check box selection it’s working but the question is i need to get back that image when i uncheck the
here my code follows

    <div class="grid row-fluid">
      <div>
        <span class="span1">                
        <input type="checkbox" class="regular-checkbox" id="Header" />
        <label for="Header"></label>                
        </span> 
        <span class="span1"> <img class="img-polaroid" src="http://placehold.it/140x140"></span> 
       </div>


         <div>
        <span class="span1">                
        <input type="checkbox" class="regular-checkbox" id="Header" />
        <label for="Header"></label>                
        </span> 
        <span class="span1"> <img class="img-polaroid" src="http://placehold.it/140x140"></span> 
       </div>
       </div>


       <div id="div2"></div>

this is my jquery

       $(function(){
  $('input[type="checkbox"]').click(function(){
    AddToCart(this);
  });
});

function AddToCart(obj) {
  var $this = $(obj).closest('div');
  var img = $this.find('img');
  $('#div2').append(img);
}

it’s workin need to get back those image checked when unchecked please help me to do this thanks in advance

Answer 1

try this one

$('input').change(function(){
   if($(this).is(':checked')){
      var $this = $(this).closest('div');
      var img = $this.find('img');
      $('#div2').append(img);
 }
 else {
      var img = $('#div2').find('img');
      var $this = $(this).closest('div');
      $this.append(img);
 }
});

Code bug solved