jQuery .val（）/。text（）不适用于特定的html块

Question

I am using HandlebarsJS with Yii and PHP to render a page. Below is a block of html/handlebars code from the page

{{#if embed_link}}
       <p class='f_hidden_p'>
           <a href='{{embed_link}}'>
              {{embed_link}}
            </a>
       </p>
       <div class = 'link-wrapper'>
          <div class = 'link-container'>
              <a class = 'link-anchor-box'>
                  <div class = 'link-pic-wrap'>
                      <div class='playable_wrap'>
                         <div class='play_btn'></div>
                            <div class = 'link-img'></div>
                      </div>
                      <div class = 'link-text-data'>
                          <div class = 'link-text-title'> 
                             <span class = 'link-text-website'></span>
                          </div>
                          <div class = 'link-text-about'></div>
                       </div>
                   </div>
              </a>
            </div>
         </div>
{{/if}}

The above code only runs when embed_link is true. In my test case it is, and when it runs I need to use jQuery to get the text from "f_hidden_p" . So in the js file I have,

$(document).ready(function(){
   console.log($('.f_hidden_p').text());
   console.log($('.f_hidden_p').val());
});

For some reason this returns an empty string or undefined. When I inspect element and check, I can see that the value of {{embed_link}} has a value that is not an empty string. After that I tried, giving the anchor tag an unique id "embed_link" and tried.

$(document).ready(function(){
       console.log($('#embed_link').text());
       console.log($('#embed_link').val());
});

But that didn't work either. I tried that same syntax with different divs in the HTML that are also within a handlebars block and it worked perfectly. It just doesn't work for this block for some reason. NOTE : .f_hidden_p is hidden -> it's display is 'none' in CSS. But I am quite sure that shouldn't stop .text() or .val() from getting the text.

Thanks for the help!

Answer 1

I'm adding this for better formatting ...

Did you try this?

$(document).ready(function(){
  setTimeout(function() {
   console.log($('.f_hidden_p').text());
   console.log($('.f_hidden_p').val());
  }, 2000);
});

... with no results?