JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.3.1/mustache.min.js"></script>
<body>
  <p>
    {{name}}
  </p>
  <p>
  Thank you for reaching out to us! This is an automated reply, and one of us shall reach out to you, 
            for real, shortly. Here is a copy of the message you sent us for reference:
</p>
<p>
  <blockquote class=separate-lines>
  <span><label class="first left">Sender:</label> {{sender}}</span>
  <span><label class="first left">Subject:</label> {{subject}}</span>
  <span><label class="first left">Message:</label> {{message}}</span>
  </blockquote>

</p>
            
            
  <p id=closing>           
            Mike Warren
            Open Source Roads
  </p>
</body>

CSS

#closing { 
  white-space: pre-line;
}

.separate-lines { 
  white-space: pre-line;
}

.first { 
  width: 80px;
}

.left {
  float: left;
}

JavaScript

$(function() { 
	var data = {
    sender: "[email protected]",
    name: "Joe Smith",
    subject: "RE: Your org",
    message: "I like what you're doing \n" + 
    	"multiline text"
  }
	template = $('body').html()
	rendering= Mustache.render(template, data)
  $('body').html(rendering)
})