JSFiddle - React, Tailwind, and code Playground

HTML

<div style="width: 400px;">
            <label style="width: 100%;" for="fP">First Post:</label>
            <textarea style="width: 100%;" id="fP" rows="10" cols="50"></textarea>
            <label style="width: 100%;" for="sP">Second Post:</label><br/>
            <textarea style="width: 100%;" id="sP" rows="10" cols="50"></textarea>
            <button style="margin-top: 10px;margin-bottom: 20px; width: 100%;" onclick="a()">Submit</button>
            <label style="width: 100%;" for="oP">Output:</label><br/>
            <textarea id="oP" style="width: 100%" rows="10" cols="50"></textarea>           
        <button style="margin-top: 10px;margin-bottom: 20px; width: 100%;" onclick="c()">To ASCII</button>
        </div>

JavaScript

function a(){
            var fP = document.getElementById('fP').value.replace(/\s/g, ""),
                sP = document.getElementById('sP').value.replace(/\s/g, ""),
                oP = "";
            for (var x = 0; x < fP.length; x++){
                if (fP[x] === sP[x]){
                    oP += fP[x];
                }
            }
            document.getElementById('oP').value = oP;
        }
        function b(h) {
            var hh = h.toString();
            var str = '';
            for (var i = 0; i < hh.length; i += 2)
                str += String.fromCharCode(parseInt(hh.substr(i, 2), 16));
            return str;
        }
        function c(){
            var z = b(document.getElementById('oP').value.replace(/\s/g, ""));
            document.getElementById('oP').value = z;
        }