Labels not Displaying on Scatterplot?

Question

I made a scatter plot using JavaScript, but I'm having trouble displaying the dataset labels for each circle. I'm trying to display the labels near each circle.

I tried resizing the canvas and changing the padding value, I also tried position the labels so they can appear but nothing seems to be working

See the code and the picture of the output below.

var w = 500;
var h = 300;
var padding = 50;

        var dataset = [
                        [5, 20],
                        [500, 90],
                        [250, 50],
                        [100, 33],
                        [330, 95],
                        [410, 12],
                        [475, 44],
                        [25, 67],
                        [85, 21],
                        [220, 88],

                        //Outliers
                        [0, 140], 
                        [700, 5] 
                    ]; 
        
        //SVG for the xScaleLinear
        var xScale = d3.scaleLinear()
            .domain([0, d3.max(dataset, function(d) {
                return d[0];
            })])
            .range([padding, w - padding]);

        //SVG for the yScaleLinear
        var yScale = d3.scaleLinear()
            .domain([0, d3.max(dataset, function(d) {
                return d[1];
            })])
            .range([h - padding, padding]);
 
        var svg = d3.select("body")
                    .append("svg")
                    .attr("width", w)
                    .attr("height", h);
        
        //X Axis
        var xAxis = d3.axisBottom()
            .ticks(5)
            .scale(xScale);
        
        //Y Axis
        var yAxis = d3.axisLeft()
            .ticks(5)
            .scale(yScale);
        
        //Appending xAxis
        svg.append("g")
            .attr("transform", "translate(0," + (h - padding) + ")") // Move the x-axis to the bottom, accounting for padding
            .call(xAxis);
        
        //Appending yAxis
        svg.append("g")
            .attr("transform", "translate(" + padding + ",0)") // Adjusted transform value
            .call(yAxis);

        //SVG for Dots
        svg.selectAll("circle")
            .data(dataset)
            .enter()
            .append("circle")
            .attr("cx", function(d, i) {
                return xScale(d[0]);
            })
            .attr("cy", function(d) {
                return yScale(d[1]); // Using the yScale function
            })
            .attr("r", 5)
            .attr("fill", function(d) {
            return (d[0] === 500 && d[1] === 90) ? "red" : "#3362b8"; //Circle colour for [500, 90]
            });
        
        //SVG for labels
        svg.selectAll("text")
            .data(dataset)
            .enter()
            .append("text")
            .text(function(d){
                return d[0] + "," +d[1];
            })
            .attr("x", function(d) {
                return xScale(d[0]); //Adjust label position
            })
            .attr("y", function(d) {
                return yScale(d[1]) - 10;
            })
            .attr("fill", "#3362b8")
            .attr("font-size", "12px")
            .attr("text-anchor", "middle");

Code Output: Scatterplot