diff --git a/awx/ui/client/src/job-detail/job-detail.partial.html b/awx/ui/client/src/job-detail/job-detail.partial.html
index 578e17510f..18c90cf646 100644
--- a/awx/ui/client/src/job-detail/job-detail.partial.html
+++ b/awx/ui/client/src/job-detail/job-detail.partial.html
@@ -354,7 +354,7 @@
                                 <tbody>
                                     <tr class="List-tableRow cursor-pointer" ng-class-odd="'List-tableRow--oddRow'" ng-class-even="'List-tableRow--evenRow'" ng-repeat="result in results = (hostResults) track by $index">
                                         <td class="List-tableCell col-lg-4 col-md-3 col-sm-3 col-xs-3 status-column">
-                                        <a ui-sref="jobDetail.host-event.details({eventId: result.id, taskId: selectedTask})" aw-tool-tip="Event ID: {{ result.id }}<br \>Status: {{ result.status_text }}. Click for details" data-placement="top"><i ng-show="result.status_text != 'Unreachable'" class="JobDetail-statusIcon fa icon-job-{{ result.status }}"></i><span ng-show="result.status_text != 'Unreachable'">{{ result.name }}</span><i ng-show="result.status_text == 'Unreachable'" class="JobDetail-statusIcon fa icon-job-unreachable"></i><span ng-show="result.status_text == 'Unreachable'">{{ result.name }}</span></a>
+                                        <a ui-sref="jobDetail.host-event.details({eventId: result.id, taskId: selectedTask})" aw-tool-tip="Event ID: {{ result.id }}<br \>Status: {{ result.status_text }}. Click for details" data-tip-watch="result.tip" data-placement="top"><i ng-show="result.status_text != 'Unreachable'" class="JobDetail-statusIcon fa icon-job-{{ result.status }}"></i><span ng-show="result.status_text != 'Unreachable'">{{ result.name }}</span><i ng-show="result.status_text == 'Unreachable'" class="JobDetail-statusIcon fa icon-job-unreachable"></i><span ng-show="result.status_text == 'Unreachable'">{{ result.name }}</span></a>
                                         </td>
                                         <td class="List-tableCell col-lg-3 col-md-4 col-sm-3 col-xs-3 item-column">{{ result.item }}</td>
                                         <td class="List-tableCell col-lg-3 col-md-4 col-sm-3 col-xs-3">{{ result.msg }}</td>
diff --git a/awx/ui/client/src/job-detail/job-detail.service.js b/awx/ui/client/src/job-detail/job-detail.service.js
index 080339e7dd..e5578349a5 100644
--- a/awx/ui/client/src/job-detail/job-detail.service.js
+++ b/awx/ui/client/src/job-detail/job-detail.service.js
@@ -39,6 +39,13 @@ export default
             }
             catch(err){return;}
         },
+        processsEventTip: function(event, status){
+            try{
+                var string = `Event ID: ${ event.id }<br>Status: ${ _.capitalize(status.status)}. Click for details`;
+                return typeof item === 'object' ? JSON.stringify(string) : string;
+            }
+            catch(err){return;}
+        },
         // Generate a helper class for job_event statuses
         // the stack for which status to display is
         // unreachable > failed > changed > ok
@@ -88,6 +95,7 @@ export default
                     var status = self.processEventStatus(event);
                     var msg = self.processEventMsg(event);
                     var item = self.processEventItem(event);
+                    var tip = self.processsEventTip(event, status);
                     results.push({
                         id: event.id,
                         status: status.status,
@@ -96,6 +104,7 @@ export default
                         task_id: event.parent,
                         name: event.event_data.host,
                         created: event.created,
+                        tip: typeof tip === 'undefined' ? undefined : tip,
                         msg: typeof msg === 'undefined' ? undefined : msg,
                         item: typeof item === 'undefined' ? undefined : item
                     });