How to remove line break displayed on calendar webpart on a SharePoint 2013 page

On Calendar, an event displays with the Time in one line and the rest, Title, Attendee, location in another line. like this:

9:00 am - 10:00 am

Meeting John Smith New York

But the second line extends beyond the event grid,  user can't see entirely.

So I used a work flow to break the second line into 3  lines with <br/> inserted in between so  it displays like this:

9:00 am - 10:00 am

Meeting

John Smith

New York

But the problem is when the calendar webpart is added to the landing page, the <br/> is displayed instead.  So I used a JavaScript to get rid of the <br/>.  Following script achieved this on the calendar current month view, but as soon as I navigate to other month, the <br/> returned:

<script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>

<scripttype="text/javascript">

function updateCalendarWeekday(){

   $('#WebPartWPQ2 .ms-acal-sdiv a').each(function(){
     var str = $(this).html();
     str = str.replace(/&lt;/g,"<");
     str = str.replace(/&gt;/g,">");
     $(this).html(str);
});
}

_spBodyOnLoadFunctionNames.push('ready');

function ready()
{
setTimeout(updateCalendarWeekday,1000);
}

</script>

<styletype="text/css">
.ms-acal-item{
HEIGHT:60px!important
}
.ms-acal-summary-itemrow{
HEIGHT:85px!important
}
</style>

My other thread related to this topic: https://social.technet.microsoft.com/Forums/en-US/cd5a3025-75d8-4547-8f22-9d00199f569a/javascript-on-page-works-in-sharepoint-2010-but-not-sharepoint-2013?forum=sharepointgeneral

Any one has an idea how to make this work?