JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<html>
<style>
</style>
<body>
<div class="col-sm-6">


<script type="text/javascript">

// i put the code here
function displaytickets(){
		var $panel = $('<div/>').addClass('col-xs-3 panel panel-default')
    $panel.append($('<div><h3 class="panel-title">Title</h3></div>').addClass('panel-heading'))
    $panel.append($('<div>Panel content</div>').addClass('panel-body'));
    $('body').append($panel);
    
  	// let's assume your ajax returns 4 tickets
    var data = {
    	'tickets' : [
      	{'description' : 'Description_1', 'status': 'Status_1', 'subject': 'Subject_1' },
      	{'description' : 'Description_2', 'status': 'Status_2', 'subject': 'Subject_2' },
      	{'description' : 'Description_3', 'status': 'Status_3', 'subject': 'Subject_3' },
      	{'description' : 'Description_4', 'status': 'Status_4', 'subject': 'Subject_4' }
      ]
    };
    
    for (i = 0; i < data.tickets.length; i++) {
    	var new_panel = $panel.clone(); // note the use of .clone()
      new_panel.find('.panel-title').text(data.tickets[i].subject);
      new_panel.find('.panel-body').text(data.tickets[i].description);
      $('body').append(new_panel);
		}
}

displaytickets();
</script>
</div>
</body>
</html>