jQuery: .next() doesn't working within .each() loop

jQuery: .next() doesn't working within .each() loop

I'm using bootstrap-tooltip plugin to display tooltips. And my HTML is
like this:
<a href="#" data-role="tooltip" title="">actions</a>
<div class="user-actions">
<a class="icon" href="/edit">
<i class="icon-pencil"></i>
</a>
<a class="icon" href="/delete">
<i class="icon-trash"></i>
</a>
</div>
My JS:
$(function() {
$('[data-role=tooltip]').tooltip({
html: true,
placement: 'bottom',
trigger: 'click'
});
$('a[data-role=tooltip]').each(function(){
var content = this.next().html()
this.attr('title', content);
});
});
What I want my script to do is to loop through every <a
data-role='tooltip' title=''> selector, then find immediately following
selector, get its html and put it as a value of title attribute.
BUT
it just doesn't work. The console error says:
Uncaught TypeError: Object [object HTMLAnchorElement] has no method 'next'
What I did wrong? And how I can make it work?
Help me please