css selectors - jQuery $("#field") is null?

Question

I have a selectbox with month periods in it.

Here is my code:

$(function(){ 
                        $("#ppsub_ppterm_id").change(function(){ 
                                        var term = this.options[this.selectedIndex].text; 
                                        if(term == "Eenmalig"){ 
                                                $(".idealtd").show(); 
                                        }else{ 
                                                $(".idealtd").hide(); 
                                                //$("#ppsub_amount option:selected").val('anders'); 
                                        } 
                        }); 
        }); 
<select name="ppsub_ppterm_id" class="ppsub_ppterm_id" 
id="ppsub_ppterm_id" style="width: 100px; font-size: 11px;"> 
                                                <option value="M">Maand</option> 
                                                <option value="K">Kwartaal</option> 
                                                <option value="H">Halfjaar</option> 
                                                <option value="J">Jaar</option> 
                                                <option selected value="E">Eenmalig</option> 
                                        </select> 

But when i load my page i staight away get an error:

$("#ppsub_ppterm_id") is null

Line 17

Any ideas?

Answer 1

Sounds like JQuery isn't loading properly. Which source/version are you using?

Alternatively, it could be namespace collision, so try using jQuery explicitly instead of $. If that works, you may like to use noConflict to ensure the other code that's using $ doesn't break.