JSFiddle - React, Tailwind, and code Playground

by stefek99

HTML

<div id="logs"></div>
<div id="store" data-content="eee\nfff"></div>
<!-- storing \n in DOM as data attribute does not work - any ideas why? -->

    <textarea id="textarea1" rows=5></textarea>
<hr>
    <textarea id="textarea2" rows=5></textarea>
<hr>
    <textarea id="textarea3" rows=5></textarea>
<hr>
    <textarea id="textarea4" rows=5></textarea>

JavaScript

var logs=document.getElementById('logs');
function logIt(msg){
    var e=document.createElement('div');
    e.innerHTML=msg;
    logs.insertBefore(e,logs.firstChild);
}

stringWithNewLines = "aaa\nbbb";
$("#textarea1").val(stringWithNewLines);
$("#textarea2").val("ccc\nddd");

var storeContent = $("#store").data("content");
logIt(typeof(storeContent));
logIt(storeContent === "eee\nfff");
logIt(storeContent == "eee\nfff");

$("#textarea3").val(storeContent);

$("#store").data("content2", "ggg\nhhh");
var storeContent2 = $("#store").data("content2");
$("#textarea4").val(storeContent2);