Hello all,
Can anyone see anything that is wrong with this code it just isn't working...
I am tring to:
get the value of #product-variants-option-0
search #preload for the relevant image and
then change div.image img src to that image
jQuery(document).ready(function($) {
$('#product-variants-option-0').change(function() {
// What is the sku of the current variant selection.
var select_value = $(this).find(':selected').val();
if (select_value == "Kelly
Green") {
var keyword = "kly";
};
var new_src = $('#preload img[src*=keyword]');
$('div.image img').attr('src', new_src);
});
});
The selection:
<select class="single-option-selector-0" id="product-variants-option-0">
<option value="Kelly
Green">Kelly Green</option>
<option value="Navy">Navy</option>
<option value="Olive">Olive</option>
<option value="Cocoa">Cocoa</option>
</select>
I'm trying to search an unordered list:
<ul id="preload" style="display:none;">
<li><img src="0z-kelly-green-medium.jpg"/></li>
<li><img src="0z-olive-medium.jpg"/></li>
</ul>
The image I'm trying to replace is this:
