Tooltip getting till the apostrophe

function parser(rowObject){
    var CategoryValue = rowObject.ProposalCategory;
    var SubCategoryValue = rowObject.ProposalSubCategory;
    var Values = "";
    var CategoryTooltip = "";
    if( CategoryValue !== null && CategoryValue!==undefined &&  CategoryValue != '')
    {
        Values += '<div style="">' + CategoryValue + '</div>' ;
        CategoryTooltip+=CategoryValue;
    }
    if ( SubCategoryValue !== null && SubCategoryValue!==undefined &&  SubCategoryValue != '')
    {
        Values += '</br><div style="margin-top: -22px;font-size: 10px;">' + SubCategoryValue+ '</div>';
        CategoryTooltip+="\n"+SubCategoryValue;
    }
    
    return "<div title='"+CategoryTooltip+"'>"+Values+"</div";


}

here i am getting data from the server(rowobject) it is fine and category,subcategory values are coming and tooltip is also fine but the issue is if a subcategory is have a apostrophe in word say for example "Don't" for those words when we hover it is getting displayed till Don. Please help I used replace(/\'/g, "'") and all types of replace. Please help