Estoy construyendo algunos elementos DOM en la página y quiero mantener una referencia a un elemento secundario en el elemento principal para actualizaciones posteriores.

 for(i = 0; i < itemList.length; i++) { const item = $(`<div></div>`); item.addClass('List_Item'); item.title = $(`<div></div>`).addClass('List_Title'); item.append(item.title); $(item).init.prototype.getName = function() { return $(this).data('name'); } $(item).init.prototype.setName = function(name) { $(this).data('name', name); $(this).find('.List_Title').text(name); } item.setName(sources[i].name); }

¿Cómo puedo evitar usar .find() de esta manera para capturar el elemento secundario con un selector y, en su lugar, mantener una referencia en el item elemento en sí?

Editar:

He optado por una función guardada en una tienda .data()

 item.data('name', sources[i].name); var getName = function() { return item.data('name'); } var setName = function(name) { item.data('name', name); title.text(name); } item.data('setName', setName);

Luego puedo acceder a esto externamente más tarde así

 $('.List_Item').each(function(index, item) { if($(item).data('name') == prevName) { var setName = $(item).data('setName'); setName(newName); } });