jquery - カスタム jQuery 下線

Question

こんにちは、私は jQuery カスタム下線プラグイン (以下) を使用しています。コードは比較的単純です。現在、下線はマウスオーバー機能で表示され、マウスアウトで消えます。また、下線のインスタンスは一度に 1 つだけ Web ページに存在できます。マウスの動きに関係なく下線が永続的になり、1 つのページに複数のインスタンスが存在できるようにコードを調整したいと思いますが、それを機能させるのに苦労しています。現在のコードは次のとおりです。

<script language="JavaScript" type="text/javascript">
   $(document).ready(function() {
        $('.underline a').underline({
            width:           4,                     //default: 1
            distance:        -1,                    //default: 0
            color:           '#66FFB2',     //default: #000
            durationOn:  350,                       //default: 250
            durationOff: 350,                       //default: 250
            extend:          2,                     //default: 2,
            linkOn:          'mouseover',   //default: 'mouseover'
            linkOff:         'mouseout'             //default: 'mouseout'
    });
    });
</script>



(function($){  
$.fn.underline = function(options) {
    var defaults = { 
                    width:       1,
                    distance:    0,
                    color:       '#000',
                    durationOn:  250,
                    durationOff: 250,
                    extend:      2,
                    linkOn:      'mouseover',
                    linkOff:     'mouseout'
                   };

    var options = $.extend(defaults, options);

    return this.each(function() { 
        obj = $(this);

        //Mouse Events
        var linkOn = options.linkOn;
        var linkOff = options.linkOff;

        obj.bind(linkOn, function() {
          $('#underlineLine').remove();

            var position  = $(this).offset();
            var top       = position.top;
            var left      = position.left;

            var objWidth  = $(this).width();
            var objHeight = $(this).height();

            $('body').append('<div id="underlineLine"></div>');

            $('#underlineLine').css({'position'        :'absolute',
                                     'display'             :'none',
                                     'height'           : options.width+'px',
                                      'background-color': options.color,});

            $('#underlineLine').css({'left' : left-options.extend,
                                     'top'  :      top+objHeight+options.distance,
                                     'width':     objWidth+options.extend*2 })
                                    .fadeIn(options.durationOn);

        });

        obj.bind(/*linkOff,*/ function() {
            $('#underlineLine').fadeOut(options.durationOff);

        });
    });  
};
})(jQuery);

<div class="underline"><a href="#">LINK</a></div>

ありがとう！