title: how to make this javascript code shorter?
body: <p>I created this small game while ago and now i'm trying it find a way to make it script short and simpler i was wondering if there is any another way . I have four pics of animals and blow the pic i have four names . what the game suppose to do is when the users click on right image and right name both the image and the name has to disappear. Any help really appreciate it</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>function image_select() {
      var pic1 = document.getElementById("cow").value;
      var text1 = document.getElementById("cow_t").value;
  
      if (document.getElementById("cow").checked) {
          if (pic1 == text1) {
              var x = document.getElementById("cow_s");
              x.play();
          } else {
              alert("wrong selection");
          }
      } else {
          alert("no");
      }
  }
  
  function image_select2() {
      var pic2 = document.getElementById("dog").value;
      var text2 = document.getElementById("dog_t").value;
  
      if (document.getElementById("dog").checked) {
          if (pic2 == text2) {
              var x = document.getElementById("dog_s");
              x.play();
          } else {
              alert("wrong selection");
          }
      } else {
          alert("no");
      }
  
  }
  
  
  function image_select3() {
      var pic3 = document.getElementById("horse").value;
      var text3 = document.getElementById("horse_t").value;
  
      if (document.getElementById("horse").checked) {
          if (pic3 == text3) {
              var x = document.getElementById("horse_s");
              x.play();
          } else {
              alert("wrong selection");
          }
      } else {
          alert("no");
      }
  
  }
  
  function image_select4() {
      var pic4 = document.getElementById("pig").value;
      var text4 = document.getElementById("pig_t").value;
  
      if (document.getElementById("pig").checked) {
          if (pic4 == text4) {
              var x = document.getElementById("pig_s");
              x.play();
          } else {
              alert("wrong selection");
          }
      } else {
          alert("no");
      }
  
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div style="margin-left:230px;"&gt;
      &lt;br&gt;
      &lt;br&gt;
  &lt;img onmousedown="dog.play()" height="142" width="142" src="image/cow.jpg" alt="Cow" data-value="cow" onclick="selectImage(event)" /&gt;
   &lt;img  height="142" width="142" src="image/dog.jpg" alt=""  data-value="dog" onclick="selectImage(event)"/&gt; 
    &lt;img height="142" width="142" src="image/horse.jpg" alt="" data-value="horse" onclick="selectImage(event)"/&gt;  
      &lt;img height="142" width="142"  src="image/pig.jpg" data-value="pig" onclick="selectImage(event)"/&gt;
  &lt;/div&gt;
      &lt;br&gt;
      &lt;br&gt;
      &lt;br&gt;
      
      &lt;div style="margin-left:400px;"&gt;
       &lt;button type="button" onclick="selectName(event)" value="pig" id="pig_t"&gt;Cochon&lt;/button&gt;
       &lt;button type="button" onclick="selectName(event)" value="cow" id="cow_t"&gt;Vache&lt;/button&gt;
       &lt;button type="button" onclick="selectName(event)" value="horse" id="horse_t"&gt;Cheval&lt;/button&gt;
       &lt;button type="button" onclick="selectName(event)" value="dog" id="dog_t"&gt;chien&lt;/button&gt;
      &lt;/div&gt;
     </code></pre>
  </div>
  </div>
  </p>