Datatable sorting on Bootstrap tooltip title instead of text

lilbud

On a current project, I have a datatable with event info, and links in the form of dates. On some of the links, I've added a Bootstrap tooltip to show more info (like location). Though after adding the tooltip to the link, I've found that the column sorting is going off of that instead of the actual cell text.

Here are some of the rendered HTML cells:

<span data-bs-toggle="tooltip" data-bs-placement="top" data-bs-html="true" data-bs-custom-class="custom-tooltip" data-bs-title="2025-07-03 [Thu]<br>San Siro"><a href="/events/20250703-01/">2025-07-03 [Thu]</a></span>
<span data-bs-toggle="tooltip" data-bs-placement="top" data-bs-html="true" data-bs-custom-class="custom-tooltip" data-bs-title="2018-12-15 [Sat]<br>Walter Kerr Theatre"><a href="/events/20181215-01/">2018-12-15 [Sat]</a></span>

The desired order would be as shown above, 2025 then 2018. However, with the tooltip, it is instead sorting based off of the tooltip title, and the second one is getting listed first when sorting decending (Walter > San).

I want the column to be sorted based on the date within the a link. This worked perfectly before, but when the tooltip is added, the sorting suddenly doesn't work like that anymore. I tried adding the html "data-order/data-sort" attribute, but this doesn't work.

The site is a local Django site I'm working on, so I can't link to the page. Here is the datatable init code if needed, and I can provide anything else that might be needed.

    $(document).ready(function () {
      new DataTable('#tourTable', {
        layout: layout,
        order: [[3, 'desc']],
        drawCallback: function (settings) {
          $('[data-bs-toggle="tooltip"]').tooltip();
        }
      });
    });

Thanks in advance