javascript - How to trigger appending an element if someone selects a particular option value in jquery or js -

in jquery, i'm trying create new table heading if user selects particular option - in case "other". however, code below doesn't - insights? (new js/jquery).

note: select element appended template through jquery (if user checks box).

    <th>did graduate?</th>   </tr> <tr id="college_info">      <td><input class="id_checkbox" type="checkbox" id="college_grad" name="college_grad" value="yes">yes</input>         </td>  </tr>    <script>     $( "#college_grad" ).one("click", function() {         $( "#college_info" ).hide().append("<td><select id='college_degreename'class='degree_name'><option value='bachelors'>bachelors</option> <option class='id_otheroption' value='other'>other</option></select></td>").show("slow");     });      $( "#college_degreename").one("click", function() {     if ( $( "#table_headings .college_degreename" ).value =='other'){     $( "#table_headings" ).append("<th id=other_degreename'>name of degree/certificate</th>");     }     });  </script> 

direct event handling not work dynamically added elements. shoud use live or delegate event handling.

 $( "#table_headings").on("click","#college_degreename", function() {         if ( $(this).val() === 'other'){         $( "#table_headings" ).append("<th id=other_degreename'>name of degree/certificate</th>");         }     });