Sometimes you need to create custom unread messages counter at your website.
This is example of jQuery code snippet to make counter display messages count dynamically:
<script type="text/javascript">
jQuery(document).on('bp-better-messages-update-unread', function( event ) {
var unread = parseInt(event.originalEvent.detail.unread);
if( isNaN ( unread ) || unread < 0 ) unread = 0;
var messages_count = jQuery('.header-notifications.user-messages span');
if( unread > 0 ){
messages_count.text(unread).attr('class', 'count');
} else {
messages_count.text(unread).attr('class', 'no-alert');
}
});
</script>