After installed Wordpress 3.1, a jquery plugin selectbox i'm using not work 100 percent any more

I use this plugin in wordpress backend to replace my <select></select> with custom html codes on which i can apply css, but with wordpress 3.1, a lot of <select> don't get replaced 100%, <option> are missing in the replaced codes, for example

  <option (some attributes...)>text</option>
  <option (some attributes...)>text</option>

is supposed to be replaced with (actually not replace, the original <select> will be hide)

<div class="jquery-selectbox">
<div class="jquery-selectbox-moreButton"></div>
<div class="jquery-selectbox-list jquery-custom-selectboxes-replaced-list">
  <span>text</span> /* option 1 */
  <span>text</span> /* option 2 */
<span class="jquery-selectbox-currentItem">text of selected option</span>

while actual result is

<div class="jquery-selectbox">
<div class="jquery-selectbox-moreButton"></div>
<div class="jquery-selectbox-list jquery-custom-selectboxes-replaced-list">
  /* nothing here */
<span class="jquery-selectbox-currentItem">nothing here</span>

weird thing is there are still quite a few <select> do get 100% replaced.

i tried rollbacked to wordpress 3.0 and reinstall wordpress 3.1 twice, the script works perfectly once rollback to 3.0 and as long as 3.1 is intalled, the issue occurs.

there are no wp plugins in my test site and the jquery library is loaded completely first, my other scripts all works well. Seached a lot and no luck, but i found where the issue happens, have no idea why it goes that way though.

return this.each(function() { // for each <select>
    var _this = jQuery(this);
        ... // I added an alert here, alert(_this.attr('id')), to print <select> id, and all <select> id are catched
        jQuery('option', _this).each(function(k,v){
            ... // I added a same alert at first line this function, only replaced 100% <select> id are catched

this is the plugin codes do replacement, for all not get 100% replaced <select>, the line i commented above doesn't get implemented, looks like just be jumped.

Any ideas?

[Update] I removed all other scripts and the plugin, here is the only codes left in my script

jQuery(document).ready(function() {
  jQuery('#myadmin select').each(function() {

All options in those were not replaced 100% <select> do not get the class 'huh?'

[Update 2] I changed the script in Update 1 to

jQuery(document).ready(function() {
  jQuery('select option').addClass('huh?');

Guess what? All <option> got this class 'huh?'. It turns out like something about jQuery, but why WP 3.1?


WP 3.1 upgrade jQuery version to 1.4.4, i deregistered it and bring back jQuery 1.4.2 on my page, everything is ok now, all <select> get replaced 100%

last question is how do i mark this question as resolved?

  • 1
    you left out the most important part of the code. paste it in full
    – Bainternet
    Feb 27, 2011 at 15:19
  • do you mean codes inside the function(k,v)? i added an alert at the first line of this function, and it doesn't get implemented for all problem <select>
    – Edward
    Feb 27, 2011 at 15:23
  • Just a thought...IF WP3.1 updates some select box contents via AJAX, your function would probably be bypassed unless you hook it via jQuery's life call or whatever that is called. That would at least be an explanation. Try to alert the innerHTML of the <select> element at the beginning of your function to see if options are in there before it even gets to them.
    – wyrfel
    Feb 27, 2011 at 20:05
  • That was a bit weird itself...i guess what i'm trying to say is that you probably need to hook your function in jQuery in a way that either runs it again and again when elements get inserted on the page, or after everything else has run...if the diagnosis is true, that is.
    – wyrfel
    Feb 27, 2011 at 20:38
  • @wyrfel, i ever used alert to print _this.html(), and <option> are all there. I guess its all about the results of jQuery('option', _this), is empty. See my update.
    – Edward
    Feb 28, 2011 at 5:04

1 Answer 1


Fount this:

As for an answer to your question, nested eaches don't work in jQuery if you use the this variable. To fix your problem, try using the full style of each.

in an answer here.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.