Tutorial: Woocommerce: Display Dynamic Content For Each Product Variation
jQuery(window).load(function(){
// get the specific select element by id #model
jQuery('select#model').change(function() {
var value = "";
// get the option that has been selected
jQuery( "select#model option:selected" ).each(function() {
// get the value data-attribute, prepend it with "model"
value += "model-" + jQuery( this ).val();
// the variable value will now be identical to the id of one of the wrapping custom_variation divs
});
// Hide all custom_variation divs
jQuery( '.custom_variation').css( 'display', 'none' );
// Display only the custom_variation div witht the specific id
jQuery( '.custom_variation#' + value ).css( 'display', 'block' );
});
});