JSFiddle - React, Tailwind, and code Playground
HTML
<h1>Choose a color</h1>
<a href="#" class="red-color-selection">RED</a>
<br/>
<a href="http://www.yoursite.com/configurator_wheels.htm" class="next-button">Next</a>
JavaScript
$(function(){
// append the link to the next page with the color URL parameter
$('.red-color-selection').on('click',function(){
$('.next-button').attr('href', function() {
return this.href + '?color=red';
});
});
// Get URL Params and turn them into variables
$.extend({
getUrlVars: function(){
var vars = [], hash;
var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
for(var i = 0; i < hashes.length; i++)
{
hash = hashes[i].split('=');
vars.push(hash[0]);
vars[hash[0]] = hash[1];
}
return vars;
},
getUrlVar: function(name){
return $.getUrlVars()[name];
}
});
// set the carColor variable to the value of the color URL parmeter
var carColor = $.getUrlVar('color');
});