JSFiddle - React, Tailwind, and code Playground
HTML
<form action="#" method="post">
<fieldset>
<label for="string">Enter a html-encoded string to decode</label>
<input type="text" name="string" id="string" />
</fieldset>
<fieldset>
<input type="submit" value="decode" />
</fieldset>
</form>
<div id="output"></div>
CSS
form {
width: 80%;
margin: 0 auto 1em auto;
}
fieldset {
border: 1px solid #ccc;
border-radius: 1em;
padding: 0.5em;
}
fieldset + fieldset {
margin: 1em 0 0 0;
}
fieldset:last-child {
text-align: right;
}
label, input[type=text] {
display: block;
width: 80%;
margin: 0 auto;
}
label:after {
content: ": ";
}
JavaScript
$('form').submit(
function(){
var theString = $('#string').val();
var varTitle = $('<textarea />').html(theString).text();
$('#output').text(varTitle);
return false;
});