chain - jQuery and chaining issue -

i'm jquery rookie , maybe i'm ask basic question, i'm struggling while figuring out why jquery chaining doesn't work in case.

var container = $('#container'), items = container.find('ul.items'), moreitems = items.children('li.moreitems');  var config = { container : container, items : items, moreitems : moreitems }  var app = myapp(config);  function myapp(config) { this.container = config.container; this.items = config.items; this.moreitems = config.moreitems; this.current = 0; }  myapp.prototype.myusefulfunction() { this.moreitems[this.current].fadein(); } 

let's suppose have div#container filled ul elements have more 1 li each. i'd access n-th li , fade element in, console throws me error, stating fadein has no such method. can please me sort out?

jquery returns jquery object, a sort of array containing domelements.

when do: this.moreitems[this.current] extract domelement jquery array --> have turn jquery object able call fadein() !

$(this.moreitems[this.current]).fadein(); 

you can use .eq(index) filter matched set element corresponding index:

this.moreitems.eq(this.current).fadein(); 

demo

---

apart that, piece of code show in question has several syntax errors:

1. to add function prototype, should do:

   myapp.prototype.myusefulfunction = function() {} 

   and not myapp.prototype.myusefulfunction() {}

2. use new operator return new instance of myapp

   var app = new myapp(config); // spelling mistake: myapp != myapp !!