Change div visibility when radio button becomes se

Question

I have a div and I want to show it when the user selects a specific radio button. Also, I need to hide the div when the user selects another radio button.

I tried this;

$("#RdbToday").click(function () {
        $("#dateSelectorSpan").hide();
    }); 
    $("#RdbDateRange").click(function () {
        $("#dateSelectorSpan").show();
    });

For some reasons the .click is not working. I tried to make alert inside each function but the alert didn't fired.

I also tried to user .change but the same results.

Edit

I already included the jquery library and I have alot of jquery functions working.

here the all code:

$(document).ready(function () {
    //LoadCallsPerCampign();
    //showTotalCallsStatuses();
    //showInboundCalls();
    //LoadServiceLevel();

    $("#RdbToday").change(function () {
        $("#dateSelectorSpan").hide();
    }); 
    $("#RdbDateRange").change(function () {
        $("#dateSelectorSpan").show();
    });
})

edit 2

this is the html

<asp:RadioButton runat="server" ID="RdbToday" Text="Today" Font-Names="Calibri" GroupName="foo"/>
                <asp:RadioButton runat="server" ID="RdbDateRange" Text="Date Range:" Font-Names="Calibri" GroupName="foo"/>
                <span id="dateSelectorSpan">
                    <input type="text" id="CldrFrom" runat="server" clientidmode="Static" placeholder="From" style="width:15%" />
                    <input type="text" id="CldrTo" runat="server" clientidmode="Static" placeholder="To" style="width:15%"/>
                </span>

edit 3

for who needs the actual html. this is it

<span style="font-family:Calibri;"><input id="RdbToday" type="radio" name="foo" value="RdbToday"><label for="RdbToday">Today</label></span>
<span style="font-family:Calibri;"><input id="RdbDateRange" type="radio" name="foo" value="RdbDateRange"><label for="RdbDateRange">Date Range:</label></span>
<span id="dateSelectorSpan">
                    <input name="CldrFrom" type="text" id="CldrFrom" placeholder="From" style="width:15%">
                    <input name="CldrTo" type="text" id="CldrTo" placeholder="To" style="width:15%">
                </span>

Answer 1

You need ClientID in javascript not the server id as asp.net will generate the new CliendID for server controls and the selector you have wont find element by that id.

$("#<%= RdbToday.ClientID %>").change(function () {
    $("#dateSelectorSpan").hide();
}); 
$("#<%= RdbDateRange.ClientID %>").change(function () {
    $("#dateSelectorSpan").show();
});

Edit

The code you have is working.

Live Demo

$("#RdbToday").change(function () {
    $("#dateSelectorSpan").hide();
});
$("#RdbDateRange").change(function () {
    $("#dateSelectorSpan").show();
});