Can't remove layer associated to each checkbox using leaflet

[Imane Alfaqir]

Hi, I have an issue and I'm trying to solve it sine two days, so I have a list of data retrieving from postgres database, each item of this list is associate to a checkbox, so when I click a given checkbox the corresponding layer will display on map using of course Leaflet. My purpose is to create this layers dynamically to be enable to delete each layer when I uncheck its given checkbox. When I click each checkbox I can retrieve coordinates of its associated element from database to displayed on map, but when I checked a given checkbox, it always remove the last layer and not the correspondant layer of this checkbox. I hope I was clear. Any help is appreciated. You will find my code below:

Snippet of php file:

while ($row = pg_fetch_array($result)) 

              {

                  echo '<div id="' . $row['nom'] . '" class="col-sm-10"><li class="Liste">' . $row['nom'] . '</li>       

                  <div class="checkbox chk">

                  <label><input type="checkbox" name="id" id="DisplayCheckbox" value="' . $row['nom'] . '"></label>

                  </div>';

                  $variable=$row2['nom'];

                  if($result)

              {

                  $query2 = "SELECT st_asgeojson(st_transform(geom,4326)) from domaine where nom='$variable'"; 

                  $result2 = pg_query($query2); 

                  while ($row2 = pg_fetch_array($result2)) 

                  {

                      echo '<li class="Liste" name="id" style="display:none;">' . $row2[0]. '</li></div><br/>';

                 

                  }

                  

              }

              }

              echo '</ul>'         

      }   

?>

<script type="text/javascript">

$(document).ready(function(){

$('input[id^="DisplayCheckbox"]').on('click',function() 

{

    parent = $(this).val();

    Item = $(this).parents('#' + parent).find("li.Liste").text();

    

          

            if($(this).is(":checked"))

                

             $.drawCategory(geoItem);

            else

             

             $.removeItem(CategoryItem);

        

});

});

</script> 

External jquery file:

$.drawCategory = function(data)

 {

      dataCategory = $.parseJSON(data);

              

              

              var geojsonFeature = 

              {

                      "type": "FeatureCollection",

                        "features": [{

                        "type": "Feature",

                            

                              },

                              "geometry": {

                                  "type": dataCategory.type,

                                  "coordinates": dataCategory.coordinates

                              }

                      }]

              };

              

              Item=L.geoJson(geojsonFeature).addTo(map);

              map.fitBounds(Item.getBounds());

              

 };

 $.removeItem = function()

 {      

      

        map.removeLayer(Item);

        

        

 };

Saisissez le code ici...