How do I get all iframe elements?

I'm showing a loading indicator while some external iframes are loaded with the following code:

<html>

    <head>
        <title>Loading iframe</title>
    </head>

    <script>


    function loading_iframe(){
        document.getElementById('loading_iframe').style.display = "none";
        document.getElementById('loading').style.display = "";
        document.getElementById('loading_iframe').onload = function(){
            document.getElementById('loading').style.display = "none";
            document.getElementById('loading_iframe').style.display = "";
        }
    }
    </script>

    <body>
        <iframe id="loading_iframe" src="iframe.html" width="800" height="100"></iframe>
        <div id="loading">Loading...</div>


        <script>
            loading_iframe();
        </script>
    </body>
</html>

Problem is I'm running around 50 mini iframes per page and I don't fancy rewriting the code above to match each iframe id.

Is there a way I could match each iframe id with a regex, for example:

• loading_iframe1
• loading_iframe2
• loading_iframe3