Break text to multiple lines in bootstrap popover content

Question

I am trying to add text content of bootstrap popover with multiple lines. I am creating string with possible line break as below, I have tried \n, \r\n, <br>, <br/> and <br /> but all vain.

     var files = 'No files selected';
        if (path.length > 1) {
            files = '';
            for (var i = 0; i < path.length - 1; i++) {
                files += path[i] + '<br />';
            }
        }
     $(this).attr('data-content', files);
     $(this).popover('toggle');

from above code what input do I get in popover is shown below

I have read in some posts to add / update popover contents through content tag but didn't work. Plus there was a post to set HTML content for the popover which I didn't get. I don't know what to do to create new lines by using above method or similar one.

Solution

You could either add data-html="true" or do that in JS. For the JS solution please refer to How do you add line break to JQuery popover .