         {
             changeFXGSkin = false;
             
-            if (bgImg)
-            {
-                removeChild(bgImg);
-                bgImg = null;
+            if (_border)
+            {
+                removeChild(_border);
+                _border = null;
             }
             
             if (borderClass)
             {
                 // FIXME (jasonsj): cache instead of calling creating for every state change?
-                bgImg = new borderClass();
-                addChildAt(bgImg, 0);
+                _border = new borderClass();
+                addChildAt(_border, 0);
             }
         }
         
-        if (bgImg != null) 
+        if (_border != null) 
         {
-            layoutBorder(bgImg, unscaledWidth, unscaledHeight);
+            layoutBorder(_border, unscaledWidth, unscaledHeight);
         }
         
         // The label and icon should be placed on top of the FXG skins

        
        borderClass = getBorderClassForCurrentState();
        
        if (!(bgImg is borderClass))
            changeFXGSkin = true;
        
        // update borderClass and background

    //  Variables
    //
    //--------------------------------------------------------------------------
    private var _border:DisplayObject;
    
    private var changeFXGSkin:Boolean = false;
    
    private var borderClass:Class;
    
    public var labelDisplayShadow:StyleableTextField;
    
    /**
     *  Read-only button border graphic. Use getBorderClassForCurrentState()
     *  to specify a graphic per-state.
     * 
     *  @see #getBorderClassForCurrentState()
     */
    protected function get border():DisplayObject
    {
        return _border;
    }
    
    //--------------------------------------------------------------------------
    //
