Is there a way to add custom ids to Leaflet markers derived from a GeoJSON file?

I’m fairly new to JavaScript and I’m currently trying to connect each of my Leaflet markers to a certain portion of text in another div so that when a user clicks the marker, the site will auto scroll to that relevant point in the text.

This is the code I intend to use once each of the markers have their unique ids to be manipulated:

document.getElementById("A").addEventListener("click", function() {
  window.location.href = "#B";
});

So in this case, "A" would be the unique id given to one of the markers, and #B is the id of the text I want to scroll to.

*Edit

I should clarify that the primary issue is actually giving ID’s to the markers from the geoJson elements I added onto the map. The relevant code for this is here:

//convert points to circles in layer
function pointToLayer(feature, latlng, attributes){

    var attribute = attributes[0];

    // styling for the circles which are pink with white borders
    var geojsonMarkerOptions = {
        fillColor: "#800000",
        color: "white",
        weight: 1,
        opacity: 1,
        fillOpacity: 0.5,
    };

    var layer = L.circleMarker(latlng, geojsonMarkerOptions);

    //returns layer with circle markers
    return layer;

//function to fill the global attribute array variable at top of page
function processData(data){

    //variable to store the first feature in the data
    var properties = data.features[0].properties;

    //for loop to push each attribute name into array
    for (var attribute in properties){ 

        //indexOf will only allow attributes with population values to be pushed
        if (attribute.indexOf("Victims") > -1){
            attributes.push(attribute);

        };
    };

    return attributes; //returns attributes array to be used in callback
};


//function to retrieve the data from geojson
function getData(map){

    //load the data and calls functions
    $.getJSON("data/WarCrimes3.geojson");

};

Edit with Whole Code

var map;
var featureId =0;
var attributes = []; 

function createMap(){
    // create map and set parameters

    map = L.map('mapid', {
      center: [20.20, 136.25],
      zoom: 2,
      minZoom: 4,
      maxZoom: 8,
      maxBounds: [(25.2, 115.7), (45.7, 155.54)],
    });

    getData(map);

};

function createSymbols(data, attributes){

    L.geoJson(data, {

        pointToLayer: function(feature, latlng){

            return pointToLayer(feature, latlng, attributes);
        }

    }).addTo(map);
};

function pointToLayer(feature, latlng, attributes){

    var attribute = attributes[0];

    var geojsonMarkerOptions = {
        fillColor: "#800000",
        color: "white",
        weight: 1,
        opacity: 1,
        fillOpacity: 0.5,
    };

    var layer = L.circleMarker(latlng, geojsonMarkerOptions);

    layer.featureId = featureId++;

    console.log(layer.featureId)

    return layer;

};

function processData(data){

    //variable to store the first feature in the data
    var properties = data.features[0].properties;

    //for loop to push each attribute name into array
    for (var attribute in properties){ 

        if (attribute.indexOf("Victims") > -1){
            attributes.push(attribute);

        };
    };

    return attributes; //returns attributes array to be used in callback
};


//function to retrieve the data from geojson
function getData(map){

    $.getJSON("data/sample.geojson", function(response){

      createSymbols(response,attributes);

    });
};

$(document).ready(createMap);

The id’s are being logged, but not being assigned to the individual markers

var featureId = 0;
var attributes = [];
.
.
.
function pointToLayer(feature, latlng){
  var geojsonMarkerOptions = {
      fillColor: "#800000",
      color: "white",
      weight: 1,
      opacity: 1,
      fillOpacity: 0.5,
  };
  var layer = L.circleMarker(latlng, geojsonMarkerOptions);
  layer.featureId = featureId++;
  for (var attribute in feature.properties){ 
    if (attribute.indexOf("Victims") > -1){
      attributes.push(attribute);
    };
  };
  return layer;
}

  var map;
  var featureId = 0;
  var attributes = []; 
  
  function createMap(){
      map = L.map('mapid', {
        center: [39.75, -104.99],
        zoom: 13
      });
      getData(map);
  };
  
  function createSymbols(data, attributes){
      L.geoJson(data, {
          pointToLayer: function(feature, latlng){
              return pointToLayer(feature, latlng, attributes);
          }
      }).addTo(map);
  };
  
  function pointToLayer(feature, latlng, attributes){
      var attribute = attributes[0];
      var geojsonMarkerOptions = {
          fillColor: "#800000",
          weight: 1,
          opacity: 1,
          fillOpacity: 0.5,
      };
      var layer = L.circleMarker(latlng, geojsonMarkerOptions);
      layer.featureId = featureId++;
      for (var attribute in feature.properties){ 
        if (attribute.indexOf("Victims") > -1){
          attributes.push(feature.properties[attribute]);
          var popup = L.popup().setContent(function(layer) {
            return("Victims: " + attributes[layer.featureId]);
          });
          layer.bindPopup(popup);
        };
      };                    
      
      return layer;
  };
    
  function getData(map){
      $.getJSON("data/test-geojson.txt", function(response){
        createSymbols(response,attributes);
      });
  };
  
  $(document).ready(createMap);