I have a chat button that works. What I would like to do is to show another chat button if the first option is offline. I know this can be done however I am having trouble replicating this.

Sample:

        <br/>
        <a id="liveagent_button_online_573D0000000L1Fl_573D0000000CcTn" href="javascript://Chat" style="display: none;" onclick="liveagent.startChat('573D0000000L1Fl_573D0000000CcTn')">
            <!-- Online Chat Content -->
            <img style="-webkit-user-select: none;background-position: 0px 0px, 10px 10px;background-size: 20px 20px;background-image:linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee 100%),linear-gradient(45deg, #eee 25%, white 25%, white 75%, #eee 75%, #eee 100%);" src="http://via.placeholder.com/350x150?text=online">  
        </a>
        <div id="liveagent_button_offline_573D0000000L1Fl_573D0000000CcTn" style="display: none;">
            <!-- Offline Chat Content --><img style="-webkit-user-select: none;background-position: 0px 0px, 10px 10px;background-size: 20px 20px;background-image:linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee 100%),linear-gradient(45deg, #eee 25%, white 25%, white 75%, #eee 75%, #eee 100%);" src="http://via.placeholder.com/350x150?text=offline">
        </div>
        
        <script type="text/javascript">
            if (!window._laq) { window._laq = []; }
            window._laq.push(function(){liveagent.showWhenOnline('573D0000000L1Fl_573D0000000CcTn', document.getElementById('liveagent_button_online_573D0000000L1Fl_573D0000000CcTn'));
            liveagent.showWhenOffline('573D0000000L1Fl_573D0000000CcTn', document.getElementById('liveagent_button_offline_573D0000000L1Fl_573D0000000CcTn'));
            });</script>