JSFiddle - React, Tailwind, and code Playground

HTML

<div id="koRoot">
    <select data-bind='options: availableYears, value: selectedYear'></select>
    <table>
        <tr>
            <td data-bind="visible: isYearAfter(2014, selectedYear)">2014</td>
            <td data-bind="visible: isYearAfter(2015, selectedYear)">2015</td>
            <td data-bind="visible: isYearAfter(2016, selectedYear)">2016</td>
            <td data-bind="visible: isYearAfter(2017, selectedYear)">2017</td>
            <td data-bind="visible: isYearAfter(2018, selectedYear)">2018</td>
        </tr>
        <tr>
            <td data-bind="visible: isYearAfter(2014, selectedYear)">2014</td>
            <td data-bind="visible: isYearAfter(2015, selectedYear)">2015</td>
            <td data-bind="visible: isYearAfter(2016, selectedYear)">2016</td>
            <td data-bind="visible: isYearAfter(2017, selectedYear)">2017</td>
            <td data-bind="visible: isYearAfter(2018, selectedYear)">2018</td>
        </tr>
    </table>
</div>

JavaScript

var viewmodel = {
    selectedYear: ko.observable(2014),
    availableYears: ko.observableArray([2014, 2015, 2016, 2017, 2018]),
    isYearAfter: function (year, referenceYear) {
        alert(1);
        return referenceYear() < year;
    }
};

ko.applyBindings(viewmodel, document.getElementById("koRoot"));