Show/hide items using javascript based on label value change

See more:

Javascript

I have some html that looks like this ( this is a small exerpt)

<td id="tdSpecVisits" style="text-align: right;">
            <asp:Label ID="lblSpecVisits" runat="server" CssClass="td-visits"></asp:Label>
        </td>
        <td id="tdSpecProg" class="prognosisContainer">
            <asp:DropDownList ID="ddlSpecProg" runat="server">
            </asp:DropDownList>
        </td>
          <td id="td-refer" style="height: 22px; display:none">
                        <asp:DropDownList ID="ddlReferSpecial" runat="server" CssClass="td-refer"   style="display:none" >
                        </asp:DropDownList>
            </td>

What I am trying to do in javascript is when lblSpecVisits has a change of value (it holds a number of visits that is changed by clicking on another control) then I want to show/hide the dropdown list ddlReferSpecial.
So when lblSpecVisits is > 0 then show the dropdown otherwise hide it.

What I have tried:

I have tried adding this code to the javascript:

lblSpecVisits.width(70).kendoTextBox({ min: 0, step: 1, format: "n0", decimals: 0, change: specRefer });
   lblSpecVisits.each(specRefer);

function specRefer() { 

    alert("specRefer");

    if (lblSpecVisits.val() > 0 && (lblGpVisits.val() > 0 || lblChiroVisits.val() > 0)) {

        alert("show");
        lblReferSpecial.show();
        $("[id$=td-refer").show();
    }
    else {

        alert("hide");
        lblReferSpecial.hide();
        ddlReferSpecial.hide();
        ddlReferSpecial.prop('selected', false);
        $("[id$=td-refer").hide();
    }
}

I have tried adding this code at different points so that as the visits change, specRefer is run but I just cant get it to work. It either goes into SpecRefer and shows the first alert but does not go into the show/hide code or it doesnt go into SpecRefer at all! Im not too familiar with javascript/jquery syntax - Im sure this is possible I just cant seem to figure it out.