单词修剪工具提示jquery

Basically I want my tooltip to display company names once company_id is being hovered. However instead of displaying "Company A" for example, it just displays "Company". I realized that it's just printing everything before a space.

Here's the script:

<script type="text/javascript">
  $(document).ready(function() {
  // Tooltip only Text
  $('.masterTooltip').hover(function(){
    // Hover over code
    var title = $(this).attr('title');
    $(this).data('tipText', title).removeAttr('title');
    $('<p class="tooltip"></p>')
    .text(title)
    .appendTo('body')
    .fadeIn('slow');
}, function() {
    // Hover out code
    $(this).attr('title', $(this).data('tipText'));
    $('.tooltip').remove();
 }).mousemove(function(e) {
    var mousex = e.pageX + 20; //Get X coordinates
    var mousey = e.pageY + 10; //Get Y coordinates
    $('.tooltip')
    .css({ top: mousey, left: mousex })
 });
});
</script>

and here's my codes

<?php
  $companyCtrl = new company_controller();
  $companyInfoArr = $companyCtrl->retrieveAllCompanyInfo();
  foreach($companyInfoArr as $info) {
    $company_id = $info->getCompanyID();
    $company_name = $info->getCompanyName();
    echo "<a href='#' title=".$company_name." class='masterTooltip'>".$company_id."</a> <br>";
  }
?>

There's not problem when i manually enter the text like this

<a href="#" title="This will show up in the tooltip" class="masterTooltip">Your Text</a>