I have a manufacturer directory page, each manufacturer div ID is dynamically populated by the brand name. The goal is to allow manufacturers to share their link with their customers (ex:https://libraries.specifiglobal.com/partners/request-foodservice-equipment-libraries/#angel-po)
Obviously this isn't perfect since names often include spaces and/or an apostrophe. The functionality I am trying to achieve is to ideally replace spaces with dashes and remove the apostrophe altogether.
I have tried the code below, however it changes all div ID's to the first manufacturer in a list.
var myText = jQuery('.card-header').closest(".w-100").attr("id");
var newMyText = myText.replace(/ /g,'-');
// remove older id and place new id
jQuery('.card-header').closest(".w-100").attr("id", newMyText);
jQuery('.card-header')
.closest(".w-100")
.each(function() {
e = jQuery(this);
e.attr('id', e.attr('id').replace(/ /g,'-'));
});