HTML5 data attribute & javascript

Sometimes we write strings of messages in our javascript code, which isn't really the best practice and could prove an issue, specially if translations are involved (e.g. PHP).

With the HTML5 data attribute we can remedy this and even use the capability for other things.

Rough example:

JAVASCRIPT (jQuery)

// Loading phase 
element.html(element.attr('data-loading'));

// Success phase
element.html(element.attr('data-success'));

// Error phase 
element.html(element.attr('data-error'));

HTML

<p class="msg" data-loading="Getting your stuf..." data-success="Ok, you're all set" data-error="Oh no! Something wen wrong">Messages...</p>