I have a simple SP list grouped by folder. So my items appear with the expanded or collapsed arrow icon, the string "Folder :" and the folder name. (Example > Folder : Corporate). I have a request to remove the string "Folder :" and leave the expanded or collapsed icon and name of the folder, in this case Corporate.

This is the HTML:

<td colspan="100" nowrap="nowrap" class="ms-gb">
     <a href="javascript:" onclick="javascript:ExpCollGroup('38-1_', 'img_38-1_',event, false);return false;">
         <span class="ms-commentcollapse-iconouter" style="display: none;">
              <img class="ms-commentcollapse-icon" src="/_layouts/15/images/spcommon.png?rev=23" alt="collapse" id="img_38-1_">
         </span>
         "Folder"
         </a> 
         ": Corporate" 
         <span style="font-weight: lighter; display: none;">(25)</span>
</td>

I've tried to use the following jQuery:

$("td.ms-gb a").each(function() {
    var url = $(this).text(); 
    url = url.replace("Folder", " ");
    $(this).text(url);
});

But that removes the expanded or collapsed icon as well. I feel like I'm missing something simple, is there an easy way to do this?

up vote 1 down vote accepted

This happens due to the line:

$(this).text(url);

that replaces

<span class="ms-commentcollapse-iconouter" style="display: none;">
   <img class="ms-commentcollapse-icon" src="/_layouts/15/images/spcommon.png?rev=23" alt="collapse" id="img_38-1_">
</span>
"Folder"

with

" "

So, it means the inner html is not preserved.

Solution 1

$("td.ms-gb a").each(function() {
    var iconHtml = $(this).html(); 
    iconHtml = iconHtml.replace("Folder", " ");
    $(this).html(iconHtml);
});

Solution 2

$("td.ms-gb a").each(function() {
    var $iconouter = $(this).find('span');
    $(this).html(' ');
    $(this).prepend($iconouter);
});
  • This works perfectly. Thanks! Upvoted as well for providing two solutions. – ams Jan 10 '14 at 22:28
  • I'm glad it helped – Vadim Gremyachev Jan 10 '14 at 22:32

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.