Question

This is a follow up question. I am trying to get a input box to be hidden when a pull-down menu has the value “tid and acc”. I am at a loss why this code isn’t working, any help would much appreciated! Here is a link on jfiddle: http://jsfiddle.net/Mm7c7/

<script> 
$('#rule-type').change(function() {
       var val = $(this).val();
       if (val == 'tid and acc') {
          $('#tid-acc').show();
       }
       else {
          $('#tid-acc').hide(); 
       }
    });
</script>
<select id="rule-type">
    <option value="" selected="selected">None</option>
    <option value="tid">tid</option>
    <option value="tid and acc">tid and acc</option>
    <option value="xid">xid</option>
</select>
<input id="tid-acc">

Answer 1

Your script is being evaluated before your element is ready. Placing the script in a $(document).ready() or after the content it affects will solve the problem

http://jsfiddle.net/Wx8Jf/2

$(document).ready(function(){
    $('#rule-type').change(function() {
       var val = $(this).val();
       if (val == 'tid and acc') {
          $('#tid-acc').show();
       }
       else {
          $('#tid-acc').hide(); 
       }
    });
});