Using Chrome you can right click - Inspect element to see the html code behind that element:
I wonder how to find which php file has generated that html. Maybe there is some tool to put a breakpoint into the html so the php server will stop when trying to generate it again?
I'm using WordPress locally. I'm on Ubuntu 14.04LMS. I'm using Sublime Text 3 with XDebug.
UPDATE 1
A WordPress plugin able to put, in every file, something like the following would be a good solution (I think from my beginner's viewpoint):
echo '<!-- name_of_the_php_file.php -->';
Use this plugin "what the file" to find out the php file. Then rest it is to find out a function or something else by CTRL + F in any editor.
I want to add one more plugin which is not exactly for this purpose but it is very popular among WordPress developers and it solves this problem very well. The plugin is Query Monitor.
Another possibility would be to copy an id or class from the html. Then search that string through the source code of the WordPress web application to put a breakpoint at every place where the string appears.
However, the string could be in the database. In that case, this method won't work.
Start page code
HTML content
end page code.
Note: Sory, my English not good.
Put an echo in your PHP pages to print their name in an HTML comment based on whether a session variable is set. Then set that session variable and enjoy.
The reason I say to use a session variable is so you can create some mechanism to where you can occasionally look at this for debug purposes, but users don't normally encounter it.
Hope to find this plugin useful. use to search in files amd wasting enough time. Also i use What the file plugin as suggested before, it is a great way. But i think combining the String Locator this will have extra fun! String Locator