Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <pre><code>$(document).ready(function() { var textLength = 15; var currentLength = 0; var $lastChild = $("div#article").children(":last-child"); currentLength = $lastChild.text().length; while(currentLength &lt; textLength) { $lastChild = $lastChild.prev(); currentLength = currentLength + $lastChild.text().length; } var $related = $("div#related_article"); $related.insertBefore($lastChild); }); </code></pre> <p>The above script inserts the related article above a particular tag if the text length below them is greater than 15. You can change the textLength as per your need.</p> <p>The below code goes through all leaf nodes and it inserts the related article at the required index.</p> <pre><code>var $articleObj = $("div#article"); var $related = $("div#related_article"); var textLength = 15; function addRelatedArticle($parentObj, currentLength) { var $lastChild = $parentObj.children(":last-child"); currentLength = currentLength + $lastChild.text().trim().length; while($lastChild.length &gt; 0 &amp;&amp; currentLength &lt; textLength) { $lastChild = $lastChild.prev(); currentLength = currentLength + $lastChild.text().trim().length; } if ($lastChild.text().trim().length &lt; $lastChild.html().trim().length) { addRelatedArticle($lastChild, currentLength - $lastChild.text().trim().length); } else { if (currentLength == textLength) { $related.insertBefore($lastChild); } else { var lastChildText = $lastChild.text().trim(); $lastChild.html($related); $lastChild.prepend(lastChildText.slice(0,currentLength - textLength)); $lastChild.append(lastChildText.slice(currentLength - textLength)); } } } addRelatedArticle($articleObj, 0); </code></pre> <p>I didn't check if the existing article has atleast the required minimum number of characters. The main restriction of the script is that it will search only for the leaf nodes. i.e. It will work fine on the below HTML.</p> <pre><code>&lt;div&gt; &lt;div&gt;Some junk text&lt;/div&gt; &lt;div&gt; more junk texts&lt;/div&gt; &lt;/div&gt; </code></pre> <p>But it might not work well with the below HTML.</p> <pre><code>&lt;div&gt; Junk text &lt;div&gt;More junk&lt;/div&gt; testing text &lt;/div&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload