[avator41]

var ido = "#product-"+i;

$(ido + ' .white').click(function(){
      $(ido + " .color-img img").attr('src', $(ido + ' .radio-white').attr('data-path'));
       $(ido + " .color-text").text( $(ido + ' .radio-white').attr('data-text'));
});
$(ido + ' .black').click(function(){
      $(ido + " .color-img img").attr('src', $(ido + ' .radio-black').attr('data-path'));
       $(ido + " .color-text").text( $(ido + ' .radio-black').attr('data-text'));
});

<div class="color-item" id="product-1">
						<div class="color-img" ><img src="img/white.jpg" alt="Белый" ></div>
						<div class="color-input">
							<div class="color-radio">
								<input type="radio" name="item1" value="" data-path="img/white.jpg" data-text="Белый" checked id="color1" class="radio-white">
								<label for="color1" class="white"></label>
							</div>
							<div class="color-radio">
								<input type="radio" name="item1" value="" data-path="img/black.jpg" data-text="Черный" id="color2" class="radio-black">
								<label for="color2" class="black"></label>
							</div>
						</div>
						<p class="color-text">Белый</p>
					</div>
					<div class="color-item" id="product-2">
						<div class="color-img" ><img src="img/white.jpg" alt="Белый" ></div>
						<div class="color-input">
							<div class="color-radio">
								<input type="radio" name="item1" value="" data-path="img/white.jpg" data-text="Белый" checked id="color3" class="radio-white">
								<label for="color3" class="white"></label>
							</div>
							<div class="color-radio">
								<input type="radio" name="item1" value="" data-path="img/black.jpg" data-text="Черный" id="color4" class="radio-black">
								<label for="color4" class="black"></label>
							</div>
						</div>
						<p class="color-text">Белый</p>
					</div>