Jquery .on click not working on first click

I have a text field that I need to set the value for when a user either chooses an option from a select field or enters text in a text field and hits a link. Both events then close the div that contains the select and text field/link.

The select option works

$(document).on("change", ".select_choice", function(event) {
    var string = $(this).find("option:selected").text();
    $(this).closest(".select_toggle_area").find(".toggle_choices").toggle();
    $(this).closest(".select_toggle_area").find(".target_input").val(string);
});

The text field/link works on the second click. Any time something is entered into the field the link doesn't work on the first click. It hides the div, but doesn't update the value of the target field.

$(document).on("click", ".text_choice_button", function(event) {
    event.preventDefault();
    var string = $(this).closest(".select_toggle_area").find(".text_choice").val();
    $(this).closest(".select_toggle_area").find(".target_input").val(string);
    $(this).closest(".select_toggle_area").find(".toggle_choices").toggle();
});