JQuery & HTML Data Attribute Manipulation, Really Trying To Modify / Append A New Value To Already Added Value

I am fetching data dates and some other info from DB and target days that exists in a database and jQuery datepicker. I made everything to work but one last thing, when event is ad

Solution 1:

Some simple solution would be to pick up existing tooltip (if it exists), than append new one. The code you need to change is:

var thisCell = $('.ui-datepicker-calendar * td[data-month="' + datum[1] + '"][data-year="' + datum[0] + '"] a[data-dani="' + datum[2] + '"]');
thisTooltip = thisCell.data('tooltip') || ''; /* Keep existing data */
thisCell.css("background-color", "orange").attr('data-tooltip', thisTooltip + 'ID: ' + arr2[0] + ' / Naš br: ' + arr2[2] + ' / Vrijeme: ' + dat[1] + '\n');

Working example on JS Fiddle.

You will also notice a small change to CSS (at the end), where I changed the tooltip and added:

white-space: pre-line; /* This will allow \n to serve as break */
text-align: left; /* Cosmetics... */