On click method on a specific div - html+javascript

I develop a web that one of the page is a 400px 300px black square.

I added a on click method to the outer div tag because i want it to make a sound when the user touch it (The white area), but it make the sound even if i touch the black square.

 <div onclick="makeasound()">
         <div id="btn2" class="btnAdd" onclick="clickcounter3()"></div>
 </div>