Unable to make phone number clickable (Rails app using CoffeeScript) - ruby-on-rails

Question

I'm running a restaurant discovery website, where users see a bunch of markers on a map, they click on a marker and that opens up an infoWindow in which the user can see meta details for the restaurant.
The problem: i'm trying to make restaurant phone number clickable. When I view the output, in HTML, I see a clickable link, but instead of seeing the phone number in that link, I see my variable name instead (screenshot attached). And when I click on the link, I get an error message (screenshot attached).
See attached code - the relevant CoffeeScript file and the HTML view being rendered.
MAIN.COFFEE FILE
infoHTML = (data) ->
img = if data.photo then "<img onerror='this.parentNode.removeChild(this)' src='#{data.photo}' style='margin:5px 5px 0 0;max-height:70px'>" else ''
html = "<table><tr><td style='vertical-align:top'>#{img}</td><td>"
html += data.name + '<br>'
html += data.address + '<br>'
html += "<a href= '+ data.phone + '> + data.phone</a>" + '<br>' if data.phone
html += "<img src='/assets/uber.jpg' style='max-height:13px'> £#{data.cost}" + '<br>' if data.cost
if data.michelin_status && data.michelin_status != 'yes'
html += data.michelin_status + '<br>'
html += data.rating + '% rated' if data.rating
html + '</td></tr></table>'
VIEW BEING RENDERED
WHAT I SEE WHEN I CLICK ON THE PHONE LINK

Answer 1

You have mixed you quotes, so instead of
html += "<a href= '+ data.phone + '> + data.phone</a>" + '<br>' if data.phone
Use
html += "<a href= '"+ data.phone + "'>" + data.phone + "</a><br>" if data.phone
Also, check How to mark-up phone numbers?
Update - with the tel: prefix:
html += "<a href= 'tel:"+ data.phone + "'>" + data.phone + "</a><br>" if data.phone