Jquery Show and Hide Functions

Jquery Show and Hide Functions

I am trying to get this to work where when they select the search between
dates it will show the second date search field.
I know that the jquery is pulling in that value for the select menu bc I
can put an alert for it and when I click on the search between dates it
throws the alert at me, my only problem is getting it to show that hidden
input.
HTML:
<select name='filter' class='input-large' id="select_field">
<option value=''>Select One</option>
<option value='dateonly'>Search by Date Only</option>
<option value='search_between_dates'>Search Between Dates</option>
</select>
<input type='text' placeholder="Date">
<input type="text" placeholder="Date 2" id="date2_hiddden" class="hidden">
Javascript:
function getSelect() {
var selectValue = $("#select_field").val();
if(selectValue === 'search_between_dates') {
$("#date2_hidden").show(function() {
$("#date2_hidden");
})
} else {
$("#date2_hidden").hide();
}
}
$("#select_field").change(getSelect);
getSelect();
Neither of these work and putting the id instead of class for the second
still doesn't work.
function getSelect() {
var selectValue = $("#select_field").val();
if(selectValue === 'search_between_dates') {
$(".hidden").show();
} else {
$("#date2_hidden").hide();
}
}
$("#select_field").change(getSelect);
getSelect();