One way is to wrap the whole header thing to an anchor tag with an href attribute

<a href="url of the site">
<div class="header">
    <div class="container">
        <h1>
            <span id="ctl05_orgName">Our Company</span></h1>
    </div>
</div>
</a>

other way is handle the hiding of text and handle the click event via JQuery

$(document).ready( function() {

   // wait for page to load
    ///hide the header
    $("#ctl05_orgName").hide()
    //header click handler
    $("div.header").click( function (){ 
     window.open('http://www.google.com', '_blank'); 
    })
});

The HTML for the site pulls the organization name from the database into the header. I used CSS to hide the organization name and then displayed the logo instead. I want the logo to be linked back to the homepage. The source HTML for the page:

<div class="header">
    <div class="container">
        <h1>
            <span id="ctl05_orgName">Our Company</span></h1>
    </div>
</div>

This CSS has added the company logo:

<style>
#ctl05_orgName {
display: none;
}

.header {
background-color: #4e505d;
border: 6px solid #4e505d;
background-image: url('https://www.logoimage.png');
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
</style>

I have seen that it is possible to make a div clickable and have tried to add javascript to do that both for the div and for the span that originally displayed the company name. I am missing something as neither of these have hyperlinked the logo or div.header:

$("div.header").click(function() {window.location = https://.../;});

$("span[id$=orgName").click(function() {window.location = https://.../;});

How do I do this or is there a better way to remove the orgName, add the logo via url and make the logo hyperlinked? Thank you.