插件中的元素不接受 jQuery 方法

这是一个复选框修饰符插件。如果你有一个复选框品种的输入，这个插件基本上会创建一个更美观的版本。但是，我的一个变量似乎有问题。

输入theLabelSpinner变量。此变量应该表示插入到相应复选框标签中的<span>元素（通过 jQuery）。如果选中当前状态（复选框的值），则此微调器将向右移动。如果未选中，此微调器将保留在左侧。

不幸的是，每当我尝试在元素上调用任何jQuery函数时，它根本不起作用。控制台不会抛出错误，事实上，我什至成功地记录了这两个元素。

(function($) {
$.fn.bvCheckbox = function( customOptions ) {
    this.each( function(i) { // Beginning of loop
    var theEl = $(this); //the element
        theID = theEl.attr( 'id' ); //id="" attribute
        theName = theEl.attr( 'name' ); //name="" attribute
        theClass = theEl.attr( 'class' ); //class="" attribute
    var theLabel = $( "label[for='" + theID + "']" ); //the label corresponding to the checkbox element
        theLabelText = theLabel.text();
        theLabelSpinner = theLabel.children( 'span.bv-jquery-checkbox-label-spinner' );
    /**
     * Initiates the plugin, runs all the functions.
     *
     * */
    function init() { 
        //prepare the checkbox
        prepareCheckbox();
        //initiate current states
        initStates();
    }
    init();
    /**
     * Prepares checkbox and corresponding labels
     * */
    function prepareCheckbox() {
        //rid the label of any text
        theLabel.empty();
        //hide the checkbox
        theEl.hide();
        //add the class 'bv-jquery-checkbox-label'
        theLabel.addClass( 'bv-jquery-checkbox-label' );
        //insert the spinner
        theLabel.append( '<span class="bv-jquery-checkbox-label-spinner"></span>' )
    }
    /**
     * Sets the initial states for the checkboxes when
     * the page loads
     * */
    function initStates() {
        if ( ! currentState( theEl ) ) {
            console.log( theLabelSpinner ); // I logged it successfully
            theLabelSpinner.hide(); // Problem arises!
        }
    }
    /**
     * Retrieves the current value of the checkbox
     * STATES:
     * --------
     * checked: 1
     * unchecked: 0
     * */
    function currentState() {
        if ( theEl.is( ":checked" ) ) {
            return 1;
        } else {
            return 0;
        }
    } 
    });//End of loop
}
}(jQuery));

在initStates功能期间出现问题。这应该初始化微调器元素的位置，具体取决于复选框的状态;但是，它不起作用。我甚至尝试了一个更简单的jQuery函数，例如.hide()，但没有一个起作用。每当我记录微调器时（就像我在 initStates 函数中所做的那样），这都会被扔给我：

[prevObject: x.fn.x.init[1], context: document, jquery: "1.10.2", constructor:function, init: function…] script.js:78
[prevObject: x.fn.x.init[1], context: document, jquery: "1.10.2", constructor:function,    init: function…] script.js:78

这意味着这两个元素都已成功记录，这意味着它们确实存在，我并没有疯！有人可以把我从我现在居住的隧道里救出来吗？提前谢谢。以下是运行中的完整脚本：完整脚本