JSFiddle - React, Tailwind, and code Playground

by Andy Mcloughlin

HTML

<h1 id="title">my title</h1>
<p id="dspTitle">display title</p>
<div></div>
<p id="demo"></p>

<button onclick="myFunction()">Try it</button>

<p>selecting some text or somthing</p>

JavaScript

//displaying page name
function myFunction()
{
var x = location.href;
document.getElementById("demo").innerHTML=x;
};


//getElementById - title
$(document).ready(function(){ 
var myTitle = document.getElementById("title");
   document.getElementById("dspTitle").innerHTML=myTitle;
});

//querySelector (ID)
var bar = document.querySelector("#bar");

//jQuery ID Selector
var bar = $("#bar");

//getElementsByClassName
var baz = document.getElementsByClassName("my-baz");
 
//querySelector (Class)
var baz = document.querySelector(".my-baz");
 
//jQuery ClassSelector
var baz = $(".my-baz");

//alert(document.body.firstElementChild.textContent);
//alert(document.body.firstElementChild.nextElementSibling);
//alert(document.body.lastElementChild.textContent);
//alert(document.body.lastElementChild.nodeName);

//if(document.body.firstchild){alert("doc has first child");}

//alert(document.body.firstElementChild.innerHTML);

//alert(document.body.textContent)


for(var ele=document.body.firstElementChild; ele; ele = ele.nextElementSibling) {
    alert(ele.innerText);
}