Javascript/jQuery selectores for breeze

[rutulritz]

Hi There,

I am trying to make some list with show more link using jQuery function. Here I am using it for PLP page for swatch attribute options and using below script :

$.each(".swatch-attribute-options .swatch-option",function () {
                console.log('length',$(this));
                var $this = $(this);
                    $lis = $this.find('.swatch-option'),
                    $a = $("<a href='javascript:void(0)'>Less</a>");
                if ($lis.length > 3) {
                    $this.after($a);
                    $a.on('click',function () {
                        $lis.slice(3).toggle();
                        $a.html($a.html() === "More" ? "Less" : "More")
                    });
                }
            });

each function is giving below result while consoling it

Can you please help me on this?

Also is there any document for jQury selectors and functions like foreach, click, keyup, .css, scroll, etc. please share it with me.

Thanks

[vovayatsyuk]

1. We use Cash as a jQuery replacement. Cash docs: https://github.com/fabiospampinato/cash#collection-methods
2. There is an error in your code. You don't want to iterate over each string letter but over dom elements. '.selector' - is a string. $('.selector') - is a collection of dom elements.