Jared Caputo Jared Caputo - 5 months ago 11
HTML Question

Code to automatically insert HTML into certain points on the page?

Is there any code that I could add to the header of every page that would insert HTML at 2 or 3 points on a page (probably in the body), spread out evenly? This would be amazing for the platform that I am currently working on.

For example, maybe you wanted to embed a video using this. Ideally, I could put the code in the header, and it'd insert it 2 or 3 times in the body -- spread evenly.

Answer

Here you go: https://jsfiddle.net/westryder907/808xtyq7/

$(document).ready(function() {

  $('.body > div').each(function(i, el) {
    if (i % 3 === 0) {
      $(this).append(" Inserted text via jQuery 2.2");
      if (i > 3) {
        return false;
      }
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="header">
  <div class="body">
    <div class="region1">
      Region1
    </div>
    <div class="region2">
      Region2
    </div>
    <div class="region3">
      Region3
    </div>
    <div class="region4">
      Region4
    </div>
    <div class="region5">
      Region5
    </div>
    <div class="region6">
      Region6
    </div>
    <div class="region7">
      Region7
    </div>
    <div class="region8">
      Region8
    </div>
    <div class="region9">
      Region9
    </div>
    <div class="region10">
      Region10
    </div>
  </div>
</div>