Inserting a Div through DOMDocument into content g

Question

I am sorry if the title is confusing here is the explanation:

say we have remote page like remotesite.com/page1.html and we use the function file_get_contents to get its source, then we use DOMDocument to edit this source before printing it to our page

$url = "remotesite.com/page1.html";
$html = file_get_contents($url);
$doc = new DOMDocument(); // create DOMDocument
libxml_use_internal_errors(true);
$doc->loadHTML($html); // load HTML you can add $html
//here we do some edits to remove or add contents

I want to add the Div below to the content before printing it:

<div style="float: right; padding-right: 2px;"><a class="open_event_tab" target="_blank" href="some-hard-coded-text-here_'+content+'_title_'+lshtitle+'_event_'+id+'.html" >open event</a></div> 

Here is what i have tried but the soft coded part ( '+content+'_title_'+lshtitle+'_event_'+id+') of the href is not working

i know that the my code below may look stupid but sorry i dont have enough knowledge in php

function createDivNode($doc) {
$divNode = $doc->createElement('div');
$divNode->setAttribute('style', 'float: right; padding-right: 2px;');
$aNode = $doc->createElement('a', 'openEvent');
$aNode->setAttribute('class', 'open_event_tab');
$aNode->setAttribute('target', '_blank');
$aNode->setAttribute('href', 'some-hard-coded-text-here_'+content+'_title_'+lshtitle+'_event_'+id+'.html');
$divNode->appendChild($aNode);
return $divNode;

}

and i want to loop through the source got from remote site to get every td that look like the one below and add the div just before closing it

  <td colspan="2">
     <b>Video </b> 
     <span class="section">Sports</span><b>: </b> 
     <span id="category466" class="category">Motor Sports</span>

    //here i want to add my div
</td>

6 hours of research and i can't figure this out as i am in learning phase, so i decided to ask someone here at this helpful community

Answer 1

JQUERY

if you want to insert the div at the end of each td use append()

$('td').append('<div>Test</div>'); 

At the beginning of each td use prepend

$('td').prepend('<div>Test</div>');

For more information jquery website

Answer 2

Still now confused about your question but I think that, you want to add/append a dynamic div inside every td and if this is the case then you may try this (at least, you'll get an idea and it's very clean)

var content = 'someContent', lshtitle = 'someTitle', id = 'anId';
var attr = {
    'class' : 'open_event_tab',
    'target' : '_blank',
    'href' : 'some-hard-coded-text-here_' + content + '_title_' + lshtitle + '_event_' + id + '.html',
    'text' : 'open event'
};
var link = $('<a/>', attr);
var div = $('<div/>', { 'style' : 'float:right;padding-right:2px;' }).append(link);

$('#myTable td').append(div);

DEMO.

Update : (Question was confusing, so updated answer given below)

Just download Simple HTML DOM Perser and (documentation here)

    include('simple_html_dom.php');
    $html = file_get_html('remotesite.com/page1.html');
    foreach($html->find('table td') as $td) {
        $td->innertext = $td->innertext . '<div>New Div</div>';
    }

Also, modify only tds those have class=category

    foreach($html->find('table td.category') as $td) {
        $td->innertext = $td->innertext . '<div>New Div</div>';
    }

And you are done. Notice <div>New Div</div>, it's just an example, hope, you can make it according to your need.

Possible result of the example :

<table>
    <tbody>
        <tr>
            <td colspan="2">
                <b>Video </b> <span class="section">Sports</span><b>: </b> <span id="category466" class="category">Motor Sports</span>
                <div>New Div</div>
           </td>
        </tr>
        <tr>
            <td colspan="2">
                <b>Video </b> <span class="section">Sports</span><b>: </b> <span id="category466" class="category">Motor Sports</span>
                <div>New Div</div>
            </td>
        </tr>
    </tbody>
</table>