You can DRY your JS code, assuming you modify the HTML this way:

 - On each of the four selector `<td>`s, add a `selector` class and a `data-value="N"` attribute, where "N" refers to the `#ElementN`.
 - On each of the four selectable `<td>`s, add a `selectable` class`.

So your HTML part becomes:

    <tr>
        <td class="selector" data-id="1"><img src="#" /><br />Inserer un produit</td>
        <td><img src="#" /><br /></td>
        <td class="selector" data-id="4"><img src="#" /><br />Inserer un nv crédit</td>
    </tr>
    <tr>
        <td class="selector" data-id="2">Afficher les produits</td>
        <td class="selector" data-id="3"><a href="#">Afficher les crédits courants</a></td>
    </tr>
    <!-- ElementN sample -->
    <table id="Element1" class="selectable formInsertTab" ...

_BTW, note that I affected `data-value` in the order showed by your demo (1, 4, 2, 3), while the code posted in your question is 1, 2, 3, 4._

Then in the JS part you can:

- Take advantage of the above HTML changes to bind `click` event only once for all selectors.
- Hide selectable elements without previously checking if they show.

The resulting code is so much reduced:

    $('.selector').click(function() {
      $element = $('#Element' + $(this).data('id'));
      $('.selectable').not($element).hide();
      $element.fadeToggle('slow');
    }