JS - dates in array, link building-CodePudding

I'm looking for a way to add a working link to the eventName. If I add a link directly in the code, it will be displayed as text, not as link. Do I have to write a completely new function here or is somewhere simple trick enough? I will be grateful for your response. https://codepen.io/pigwa88/pen/poWWNej

!function () {
    var data = [
        {eventName: '<a href="#">EventName</a>', calendar: 'Work', color: 'orange', eventTime: moment("2021-12-22")},
        {eventName: '<a href="#">EventName</a>', calendar: 'Work', color: 'orange', eventTime: moment("2021-12-02")},
        {eventName: '<a href="#">EventName</a>', calendar: 'Other', color: 'green', eventTime: moment("2021-12-09")}
    ];

CodePudding user response：

Right around line 303 you have this:

  var span = createElement('span', '', ev.eventName);

The default behavior of that 3rd argument is to set it's content as text element. You can force it to render the content as HTML with this additional line.

  var span = createElement('span', '');
  span.innerHTML= ev.eventName;

Example: https://codepen.io/javacado/pen/bGoogYg?editors=1111

CodePudding user response：

You are creating the event as a span, so it just prints out the anchor tag as text

On your Calendar.prototype.renderEvents function, you should create an anchor tag and set its href

var a = createElement("a", "", ev.eventName);
a.href = "#";

Instead of

var span = createElement("span", "", ev.eventName);