Getting initial selector inside jquery plugin
<p>I got some help earlier regarding selectors, but I'm stuck with the following.</p>

<p>Lets say you have a plugin like this</p>

<pre><code>$('#box').customplugin();
</code></pre>

<p>how can I get the #box as a string in the plugin?
Not sure if that's the correct way of doing it, and any other solution would be great as well.</p>

<p>Considering #box is a select dropdown,</p>

<p>The problem I'm having is if I do the regular javascript</p>

<pre><code>$('#box').val(x);
</code></pre>

<p>The correct option value gets selected,</p>

<p>but if i try the same inside a plugin</p>

<pre><code>.....
this.each(function() {
var $this = $(this);


$this.val(x);
</code></pre>

<p>the last code doesn't really do anything.</p>

<p>I notice I'm having trouble targeting #box inside the plugin because it's a object and not a string...</p>

<p>Any help would be appreciated.</p>

<p>Thanks!</p>

<p>Edit:: Putting in the code I'm working in for better understanding</p>

<pre><code>(function($){
$.fn.customSelect = function(options) {
    var defaults = {
        myClass : 'mySelect'
    };
    var settings = $.extend({}, defaults, options);


    this.each(function() {
        // Var          
        var $this = $(this);
        var thisOpts = $('option',$this);
        var thisSelected = $this[0].selectedIndex;
        var options_clone = '';

        $this.hide();

        options_clone += '&lt;li rel=""&gt;&lt;span&gt;'+thisOpts[thisSelected].text+'&lt;/span&gt;&lt;ul&gt;'
        for (var index in thisOpts) {
            //Check to see if option has any text, and that the value is not undefined
            if(thisOpts[index].text &amp;&amp; thisOpts[index].value != undefined) {
                options_clone += '&lt;li rel="' + thisOpts[index].value + '"&gt;&lt;span&gt;' + thisOpts[index].text + '&lt;/span&gt;&lt;/li&gt;'
            }
        }
        options_clone += '&lt;/ul&gt;&lt;/li&gt;';

        var mySelect = $('&lt;ul class="' + settings.myClass + '"&gt;').html(options_clone); //Insert Clone Options into Container UL
        $this.after(mySelect); //Insert Clone after Original

        var selectWidth = $this.next('ul').find('ul').outerWidth(); //Get width of dropdown before hiding
        $this.next('ul').find('ul').hide(); //Hide dropdown portion

        $this.next('ul').css('width',selectWidth);

        //on click, show dropdown
        $this.next('ul').find('span').first().click(function(){
            $this.next('ul').find('ul').toggle();
        });

        //on click, change top value, select hidden form, close dropdown
        $this.next('ul').find('ul span').click(function(){
            $(this).closest('ul').children().removeClass('selected');
            $(this).parent().addClass("selected");
            selection = $(this).parent().attr('rel');
            selectedText = $(this).text();
            $(this).closest('ul').prev().html(selectedText);
            $this.val(selection); //This is what i can't get to work
            $(this).closest('ul').hide();
        });

    });
    // returns the jQuery object to allow for chainability.
    return this;
}
</code></pre>
