<p>...</p>
<section>
<p>...</p>
<h2>...</h2>
<p>This paragraph should be selected</p>
<div>
<p>...</p>
</div>
<p>This paragraph should be selected</p> <!--<p>Additional tag which might be added and would be picked up by the selector</p>-->
</section>
Not jquery, but you definitely don't need it for this. If you really wanted to then change to
querySelectoror whatever it is in Part 1.Part 1:
document.getElementsByTagName('P');Part 2:
const config = { childList: true, // Includes text nodes that are added or removed as children of the target element. subtree: true // Also monitors changes to all the target nodes descendants. }; let observer = new MutationObserver(function(mutations){ mutations.forEach(function(mutation){ processMutation(mutation) }); }); observer.observe(document, config); processMutation(mutation){ if(mutation.type == 'childList'){ for (let i = 0; i < mutation.addedNodes.length; i++) { doStuffWithNewP(mutation.addedNodes[i], 'added'); } for (let j = 0; j < mutation.removedNodes.length; j++) { doStuffWithNewP(mutation.removedNodes[j], 'removed'); } } } doStuffWithNewP(node, state){ // do stuff }