President SpeechTh...">
Geek Answers Handbook

JQuery modifies html inside a div class that is inside a div

How can I change only the HTML code:

<div class="name">President Speech</div>

Thats inside this div:

 <div class="videobox fl showsearchvideo" id="videoBox7"> <div class="videothumb"> <img src="http://brightcove04.o.brightcove.com/xxxxx/xxxx_xxxxx_xx-xxxxxx.jpg?pubId=xxxxxxx"> </div> <div class="name">President Speech</div> </div>

I tried:

 $('#videoBox7 .name').html('President Speech TEST!');

But that doesn't work?

Update

It does not seem to work after the video disc launches JS to populate the HTML code it is looking for.

 <script type="text/javascript"> $(document).ready(function() { $('#videoBox7 .name').html('President Speech TEST!'); }); </script>

I downloaded JS that fills the video at http://pastebin.com/DNBPNQUQ

Update 2

Found a way to achieve this by posting $('#videoBox7 .name').html('President Speech TEST!'); inside the onPlaylistLoad function of onPlaylistLoad bright star.

+4
source share
4 answers

Be sure to run this code only after adding the HTMLDivElement to the DOM:

 $(function(){ $('#videoBox7 .name').html('President Speech TEST!'); });

After chatting with the author, it became apparent that the problem was that Brightcove Video Player was loading new items to display a video playlist. A clear solution, as this point was to bind the Brightcove event system to respond after adding their elements.

+5
source

What you should work, see http://jsfiddle.net/wRgDE/

Make sure you run it on the finished document, i.e.

 $(document).ready(function(){ $('#videoBox7 .name').html('President Speech TEST!'); });
+4
source

you can just give it

  <div class="name">President Speech</div>

identifier example

  <div id = "myid" class="name">President Speech</div>

and reach it using jquery type

  $('#myid').html('President Speech TEST!');

or look here Get the second child and see how to get the nth child, and for your case, the second child.

0
source

You need to use .text()

The .text() function is actually pretty smart. You can pull text from an object and jQuery will know what you want. Your jQuery should be:

 $("#videoBox7 .name").text("President Speech TEST!");

You also need to make sure that you start jQuery to start after the entire document is loaded ready. You do not want to try to target this selector if the item is not ready. Use this:

 $(function () { $("#videoBox7 .name").text("President Speech TEST!"); });
-2
source

More articles:


All Articles