JSFiddle - React, Tailwind, and code Playground

HTML

<input type="checkbox">
<a class="button" id="download">Download</a>

CSS

a {
    padding: 0.25rem 0.5rem;
    background: lightgrey;
    color: black;
    font-family: sans-serif;
    font-weight: bold;
    text-decoration: none;
    border-radius: 0.25rem;
}

a:after {
    content: attr(href);
    font-weight: normal;
    color: grey;
    margin-left: 0.25rem;
}

JavaScript

// Get jQuery-wrapped DOM objects ready
var checkbox = $('input[type="checkbox"]'),
    downloadButton = $('a#download');

// Set up function to change URL
function chooseUrl() {
    var url =
        checkbox.is(':checked') ? 'http://example.com/default_download' : 'http://example.com/secondary_download';
    
    downloadButton.attr('href', url);
}

// Change URL on checkbox value change
checkbox.on('change', chooseUrl);

// Run chooseUrl once to set initial value
chooseUrl();