How do I make it so that a value in a slider does not exceed a value from another slider?

I am implementing a chart using chartjs and I am using two sliders to configure the x-axis value range for the data that I am showing through html and javascript but I cannot figure out how to limit and/or stop the sliders once the sliders values reach the same number.

this is what I have currently for my sliders:

<div class = "slidercontainer">
    <div class = "range-slider">
        <span class="slider-track"></span>
        <input type="range" id="start" name="min-val" class="minvalue" min="1966" max="2022" value="1966" oninput="updateMin(this, 'end')">
        <input type="range" id="end" name="max-val" class="maxvalue" min="1966" max="2022" value="2022" oninput="updateMax(this, 'start')">
        <div class="slidernumformat">
            <ln>Years: </ln>
            <ln id="startYear">1966</ln>
            <ln> - </ln>
            <ln id="endYear">2022</ln>
        </div>
    </div>
</div>

I have tried to update the sliders by taking the id and putting it in the min or max values depending on which input I am trying to fix but it didn’t work.

Javascript:

const start = document.getElementById('start');
const end = document.getElementById('end');

start.max = 2022;
end.min = 1966;

function updateMin(range) {
    console.log(range.value);
    const minValue = labels.slice(parseInt(range.value) - 1966, parseInt(end.value) - 1965);
    const dbMinValue = datapoints.slice(parseInt(range.value) - 1966, parseInt(end.value) - 1965);
    myChart.config.data.labels = minValue;
    myChart.config.data.datasets[0].data = dbMinValue;
    end.min = parseInt(range.value);
    document.getElementById('startYear').textContent = range.value; // update the start year
    myChart.update();
}

function updateMax(range) {
    console.log(range.value);
    const maxValue = labels.slice(parseInt(start.value) - 1966, parseInt(range.value) - 1965);
    const dbMaxValue = datapoints.slice(parseInt(start.value) - 1966, parseInt(range.value) - 1965);
    myChart.config.data.labels = maxValue;
    myChart.config.data.datasets[0].data = dbMaxValue;
    start.max = parseInt(range.value);
    document.getElementById('endYear').textContent = range.value; // update the end year
    myChart.update();
}

function init() {
start.addEventListener('input', function(e) {
      start.value = e.target.value;
      updateMin(start);
                });
                end.addEventListener('input', function(e) {
                    end.value = e.target.value;
                    updateMax(end);
                });
            }

            init();