Appending or adding new text next to current tooltip text JQuery

Question

I was wondering whether its possible to add new text next to or append text to existing text already on tooltip.

For example, I have a div tag containing tooltip text like so;

<div id="myDiv1" class="myDiv" title="This is Tooltip">body text </div>

As shown above, the current tooltip text is: This is Tooltip

What I want to do is using jquery, appned / add more text to this. For example,

This is toopltip for myDiv1

I have tried, but these don't seem to work and most don't return anything some return undefined, please help;

$('#myDiv1').attr("title",  $('#myDiv1').tooltip + "" + "\nSome new text to append");
$('#myDiv1').prop("tooltipText",  $('#myDiv1').tooltipText + "" + "\nSome new text to append");
$('#myDiv1').attr("data-original-title",  $('#myDiv1').tooltipText + "" + "\nSome new text to append");

Any help is welcomed :)

Answer 1

I'd do like this:

$('#test').attr('title', $('#test').attr('title') + '\nworld');

See jsfiddle.

I'd add that if you use a function it gives you the current element as context which can be really useful:

$('#test').attr('title', function() {
  console.log($(this).attr('title'));
});