[FIXED] How to replace certain div with preg_replace?

Issue

I have this code HTML:

<div class="wrap">
<div class="wp-checkbox" data-value="zf">content</div>
<div class="wp-checkbox" data-value="tdp">content</div>
</div>

I would like to replace the content of these divs, but each differently.

I tried to do it by code:

$pattern = '/=\"zf\">.*<\/div>/';
$pattern2 = '/=\"tdp\">.*<\/div>/';
$html = preg_replace( $pattern, '="zf">new content of div</div>', $html );
$html = preg_replace( $pattern2, '="tdp">new content of another div</div>', $html );

But there is a problem that this code - it replaced all my divs and I get this:

<div class="wrap">
<div class="wp-checkbox" data-value="zf">new content of div</div>
</div>

How can I change these divs one by one? How can I show in the pattern that I want to change only until the first closing </div> (not to last one)?

I would like to get this result:

<div class="wrap">
<div class="wp-checkbox" data-value="zf">new content of div</div>
<div class="wp-checkbox" data-value="tdp">new content of div</div>
</div>

Thank you in advance for help.

Solution

You really shouldn't try to use regex to parse HTML. Instead, use the DOMDocument class to process the HTML:

$doc = new DOMDocument();
$doc->loadHTML($html, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);
$xpath = new DOMXPath($doc);
$div = $xpath->query('//div[@data-value="zf"]')[0];
$div->nodeValue = "new content of div";
$div = $xpath->query('//div[@data-value="tdp"]')[0];
$div->nodeValue = "new content of another div";
echo $doc->saveHTML();

Output:

<div class="wrap">
<div class="wp-checkbox" data-value="zf">new content of div</div>
<div class="wp-checkbox" data-value="tdp">new content of another div</div>
</div>

Demo on 3v4l.org

If you must use regex, you just need to correct your patterns to make them non-greedy by adding ? after the .*:

$pattern = '/=\"zf\">.*?<\/div>/';
$pattern2 = '/=\"tdp\">.*?<\/div>/';
$html = preg_replace( $pattern, '="zf">new content of div</div>', $html );
$html = preg_replace( $pattern2, '="tdp">new content of another div</div>', $html );

Output:

<div class="wrap">
<div class="wp-checkbox" data-value="zf">new content of div</div>
<div class="wp-checkbox" data-value="tdp">new content of another div</div>
</div>

Demo on 3v4l.org

Answered By - Nick

Answer Checked By - Pedro (PHPFixing Volunteer)