javascript - 実行時に追加されたアイテムにインライン スタイルを追加すると問題が発生する

Question

" " に " a" タグがあり、同じ "a" タグにli" " をホバーするといくつかの画像が追加liされます。これらすべての img 要素でインライン スタイルを使用する必要がありますが、最初に " li" これらのスタイルは常に存在する最初の img タグにのみ適用されますが、他のものには適用されませんが、" li" にもう一度カーソルを合わせると、これらのインライン スタイルがすべての img タグに適用されます。このために、以下に示すこの JS コードを使用しています。

$(document).ready(function() {
var mouseover_interval;
var $image;

$('li.product-details').mouseenter(function() {
current_image = -1;
$image = $(this).find('a.current_product_image img');
data_srcs = $image.attr('data-srcs').split(",");

if(data_srcs.length >1){
  for (var i = data_srcs.length - 1; i >= 0; i--) {
    img = new Image ;
    img.src = data_srcs[i];
    new_img = $('<img>').attr('src', data_srcs[i]).css({display:"none"}).addClass("over");
    $(this).find('a.current_product_image').append(new_img);
    var countImg = $(this).find('a.current_product_image img');
    countImg.each(function(){
      $(this).css({
        position : 'absolute',
        left : '50%',
        marginLeft : -$(this).width()/2,
        top : '50%',
        marginTop : -$(this).height()/2,
      });
    });
  }
}
else{
  return false;
}

$images = $(this).find('a.current_product_image img.over');
mouseover_interval = setInterval(function(){
{
    $image.fadeOut(500);
    if(current_image == -1){
      $($images[$images.length-1]).fadeOut(500);
    }
    else{
      $($images[current_image]).fadeOut(500);  
    }

    current_image+=1; 
    $($images[current_image]).fadeIn(500);

    if(current_image == $images.length-1){
      current_image = -1;
    }
  }
}, 1000);
}).mouseleave( function(){
clearInterval(mouseover_interval);
$image.fadeIn(500);
$(this).find('a.current_product_image img.over').remove();
});
});

最初に「」の上にあるすべての追加要素にスタイルを追加する方法はli? 何か間違った使い方をしている場合はお知らせください。

前もって感謝します、 アシュワニ・シャルマ