Hello i got some trouble displaying some icons inside a column using CSR, what it should do is to check for the contents inside a document set and if the content is equal to a content type and add a corresponding icon.

for this im returning a div with a custom class based on the id of the element so when i query the info i need it will update the content using this unique class.

But is not appending the content inside the div, the code inside the conditions seem to works, the query is getting the right data, but in the list the content is not being added.

Any help?? thanks!!

Example idea

CSR Code

 var listName = 'listName';
 var docSetUrlBase = 
  '/path/to/site/_layouts/15/DocSetHome.aspx?id=';


 (function() {
   var item = '';
   var documentContext = {};
   documentContext.Templates = {};
   documentContext.Templates.Fields = {
    "DocIcon": { "View": function(ctx) { return '<a href="' + docSetUrlBase 
   + ctx.CurrentItem.FileRef + '" target="_blank">' + cumplimiento(ctx) + '</a>'}}
};

documentContext.ListTemplateType = 101;

   SPClientTemplates.TemplateManager.RegisterTemplateOverrides(documentContext);

})();


function cumplimiento(ctx) {
  var folderPath = ctx.CurrentItem.FileLeafRef;
  var id = ctx.CurrentItem.ID;
  var title = ctx.CurrentItem.Title;

  getItems(folderPath)
  .then(function(itemData) {
    console.log(itemData);

    for (var i = 0; i < itemData.length; i++) {
        var contentTypeId = itemData[i].ListItemAllFields.ContentTypeId;
        var id = itemData[i].ListItemAllFields.Id;


        if (contentTypeId == '0x010100BC518CBCA7403542BF454A841A7C617C0033D81DB44D6A174481029C297ECADA81') {
            console.log(itemData[i].Name);
            console.log(contentTypeId);
            $('a.' + 'id-' + id).append('<img class="icon-acta" src="../SiteAssets/icon1.svg" alt="Acta" title="Acta de constultor: ' + itemData[i].Name + '"/>');
            $('.spinner').delay(3000).fadeOut(300);

        }
        if (contentTypeId == '0x01010200559801707304394B9B71C1722E74B93900D43E57E10A8E244194F6A6ADBF0B454E') {
          console.log(itemData[i].Name);
          console.log(contentTypeId);
            $('a.' + 'id-' + id).append('<img class="icon-evidencia" src="../SiteAssets/icon2.svg" alt="Evidencia" title="Evidencia: ' + itemData[i].Name + '"/>');
        }
    }
});

return '<div class="estado-incentivo ' + 'id-' + id + '"><div class="spinner"><div class="bounce1"></div><div class="bounce2"></div><div class="bounce3"></div></div></div>';
}

 function getItems(folderName) {
   return 
   $pnp.sp.web.getFolderByServerRelativeUrl(
    _spPageContextInfo.webServerRelativeUrl + 
   '/libraryFolderName' + '/' + folderName)
    .files.expand('ListItemAllFields')
    .get();
 }