JSFiddle - React, Tailwind, and code Playground

JavaScript

jQuery("div.arena-item-toolbar a[rel=Print]").attr("href","#").attr("id","special-print-loans").click(function(e) {
	e.preventDefault();
	/*console.log("Printar hela listan");*/
	
	var stringToPrint = "";
	
	var authors = [];	
	var titles = [];
	var titleInfos = [];
	var branches = [];	
	var loans = [];	
	var returns = [];	
	
	jQuery("div.arena-record-container").each( function() {
		titles.push(jQuery(".arena-record-title", this).text());
		authors.push(jQuery(".arena-record-author", this).text());
		titleInfos.push(jQuery(".arena-record-author, .arena-record-title", this).text());
		branches.push(jQuery(".arena-record-branch span.arena-value", this).text());	
		loans.push(jQuery(".arena-record-create span.arena-value", this).text());	
		returns.push(jQuery(".arena-record-expire span.arena-value", this).text());	
	});
	
	/*console.log("Titles: " + titles.length);*/
	
	stringToPrint += '<div id="big-wrap"><div id="col2" class="col"><div class="header">Titelinfo</div>';
	for(var i=0; i < titleInfos.length; i++) {
		var ti = jQuery.trim(titleInfos[i]);
		/*console.log("Printing title: " + ti + " Len: " + ti.length);*/
		if(ti.length > 100)
			ti = ti.substr(0,95)+"...";
		stringToPrint += '<div class="row">' + ti + '</div>';
	}
	
	stringToPrint += '</div><div id="col1" class="col"><div class="header">Utlånad av</div>';
	for(var i=0; i < branches.length; i++) {
		stringToPrint += '<div class="row">' + branches[i] + '</div>';
	}
	
	stringToPrint += '</div><div id="col3" class="col"><div class="header">Utl.datum</div>';
	for(var i=0; i < loans.length; i++) {
		stringToPrint += '<div class="row">' + loans[i] + '</div>';
	}
	
	stringToPrint += '</div><div id="col4" class="col"><div class="header">Återlämnas</div>';
	for(var i=0; i < returns.length; i++) {
		stringToPrint += '<div class="row">' + returns[i] + '</div>';
	}
	
	stringToPrint += '</div><div style="clear: both"></div></div>';

	
	
	
	var headerToPrint = "";
	headerToPrint += "<title>Nacka...