title: Inline jQuery script inside the page
body: <p>Is it not possible to run jQuery in the middle of a page (inline)?</p>
  
  <p>I tried to run this code inside a custom WordPress template....</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  jQuery(document).ready( function() {
    jQuery(".upb_row_bg").css("filter","blur(30px)");
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>However it seems to have no affect on the element in question.  In fact if cannot even select the element -
   console.log('jQuery(".upb_row_bg).length; shows 0.</p>
  
  <p>If I put the same code right before the closing  tag after the wordpress wp_footer() function, it works.  If I place it before wp_footer, then it does not.</p>
  
  <p>Any ideas?  I have another script on another page where I was able to use a simple inline script that is generated by a wordpress filter...</p>
  
  <pre><code>&lt;script&gt;jQuery( "figure" ).replaceWith( "&lt;div class=\”new-class\”&gt;” + jQuery( "figure" ).html() + "&lt;/div&gt;" );&lt;/script&gt;
  </code></pre>
  
  <p>This works as expected even though with this snippet there is no event to trigger it, it just runs and replaced the preceding  element. So inline scripts must work. </p>
  
  <p>I am a bit confused.</p>