JSFiddle - React, Tailwind, and code Playground

by Adrien Be

HTML

<h1>
Google Places Library without map
</h1>
<a href="http://stackoverflow.com/questions/14343965/google-places-library-without-map" target="_blank">See stackoverflow.com/questions/14343965/google-places-library-without-map</a>
<ul class="reviews__content" id="reviews__content">
</ul>
<div id="service-helper"></div>

<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&libraries=places&callback=getRelevantGoogleReviews">
</script>
<script type="text/javascript">
   window.getRelevantGoogleReviews = function(){
     var service = new google.maps.places.PlacesService($('#service-helper').get(0)); // note that it removes the content inside div with tag '#service-helper'

     service.getDetails({
         placeId: 'ChIJAwEf5VFQqEcRollj8j_kqnE'  // get a placeId using https://developers.google.com/places/web-service/place-id
        }, function(place, status) {
            if (status === google.maps.places.PlacesServiceStatus.OK) {
              var resultcontent = '';
              for (i=0; i<place.reviews.length; ++i) {
                //window.alert('Name:' + place.name + '. ID: ' + place.place_id + '. address: ' + place.formatted_address);
                resultcontent += '<li class="reviews__item">'
                resultcontent += '<div class="reviews__review-er">' + place.reviews[i].author_name + '</div>';
                var reviewDate = new Date(place.reviews[i].time * 1000);
                var reviewDateMM = reviewDate.getMonth() + 1;
                var reviewDateFormatted = reviewDate.getDate() + '/' + reviewDateMM + '/' + reviewDate.getFullYear(); 
                resultcontent += '<div class="reviews__review-date">' + reviewDateFormatted + '</div>';
                resultcontent += '<div class="reviews__review-rating reviews__review-rating--' + place.reviews[i].rating +'"></div>';
                if (!!place.reviews[i].text){
                  resultcontent += '<div...