Wrap each child and it’s grandchildren separately

I’m not sure this class alone is sufficient to modify the output you want. You may have to extended other pieces along with the start_el. (I’ve not verified this.)

In the meantime, here’s an idea… (just as a fun twist to the approach) after the menu is generated as currently is, do a regex find and replace to reconstruct the list the way you want.

NB: This method could have unexpected results if any errors are made in the regex. So, it should not be used for anything that is critical to your application.

Say the wp_list_pages value is saved to a variable $mylist, then try this after.

$mylist = preg_replace('/^\s*\<ul[^>]*\>/is', '<div class="children-list">', $mylist);
$mylist = preg_replace('/\<\/ul\>\s*$/is', '</div>', $mylist);
$mylist = preg_replace('/\<\/ul\>\s*\<\/li>/is', '</ul>', $mylist);
$mylist = preg_replace('/<li\b[^>]*has\_children[^>]*\>(.*?)(<ul\b[^>]*\>)/is', '$2$1', $mylist);

echo $mylist;

With this concept, you did not have to even use the walker extension. You could redo the regex to fit the original output. But as I don’t know what that is, I used the output you provided in your example.

tech