JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<div>
<ul>
<li>
<div align="right">one</div>
</li>
<li>
<div align="right">two</div>
</li>
<li>
<div align="right">three</div>
</li>
</ul>
<p> </p>
</div>
CSS
li {
list-style: disc inside;
}
li > div {
display: inline-block;
width: 30%;
}
JavaScript
// create the filter for the tree walker
var div_filter = {
acceptNode: function (node) {
if (
node.tagName == 'DIV' && node.parentElement.tagName == 'LI') return NodeFilter.FILTER_ACCEPT;
}
};
// create the tree walker so we can
// find all the divs
var treeWalker = document.createTreeWalker(document.body, NodeFilter.SHOW_ELEMENT, div_filter, false);
while (treeWalker.nextNode()) {
console.log(treeWalker.currentNode);
treeWalker.currentNode.parentElement.style.textAlign = treeWalker.currentNode.getAttribute('align');
}