eventlistener函数无法触发，无法找出原因

如何解决eventlistener函数无法触发，无法找出原因

const name = document.getElementById("name");
const ingredients = document.getElementById("ingredients");
const recipe = document.getElementById("recipe");
const ginger = document.getElementById("ging");
const pineapple = document.getElementById("pine");
const carrot = document.getElementById("carr");
const toffee = document.getElementById("toff");
const icedbun = document.getElementById("iced");
const card = document.getElementsByClassName("card");

ging = {
    name: "Sticky Ginger Cake",ingredients: "<br> <ol><li>50g/20oz Butter</li><li>200g/8oz Stoned dates</li><li>300g/10oz Dark muscado sugar</li><li>2 eggs</li><li>50g/2oz Root ginger grated (2tsp)</li><li>Grated zest of a lemon</li><li>200g/8oz SR Flour</li><li>1 Bramley apple (9oz) peeled and chopped</li></ol>",recipe: "<ul><li> Butter and line a 20cm round cake tin</li><li>Put fdates in bowl and cover with boiling water</li><li>Heat butter in a pan and stir in the sugar. Allow to cool slightly</li><li>Beat in the eggs,ginger and lemon zest,then drain the dates,add to pan and mix well</li>                   <li>Stir in the flour then apples</li>                  <li>Spoon into cake tin,put cake on baking tray to stop the base browning too much.</li>                   <li>cook on gas 4/160 deg for 1 1/2 hours. If not cooked,cover with foil and cook for 15-30 mins more.</li>                   <li>Allow to cool in tin,then melt white chocolate drizzle over cake.</li></ul>"
}

carr = {
    name: "Carrot Cake",ingredients: "<ol><li>9oz SR flour</li><li>2 tsp Cinnamon</li><li>8oz Brown sugar - soft or demerara</li><li>4oz Coconut</li><li>6 oz Sultanas</li><li>2 eggs</li><li>1/2 tsp Vanilla</li><li>4oz Butter/Margerine</li><li>4oz Veg oil</li><li>4oz Grated carrots</li></ol>",recipe : "<ul><li>Preheat oven 160 deg/gas 4</li><li>Mix all dry ingredients together</li><li>Beat the eggs,vanilla,butter/margerine,and veg oil together</li><li>Add dry ingredients</li><li>Add grated carrots</li><li>Put in tin and sprinkle with demerara sugar</li><li>Cook for 1 to 1 1/2 hours</li></ul>"
}

pine = {
    name: "Pineapple Cake",ingredients: "<ol><li>1/2 Cup of butter,softened</li><li>1 Cup or sugar</li><li>1/4 tsp Sale</li><li>1/4 tsp Bicarbonate of soda</li><li>2 eggs</li><li>1 1/2 Cups of flour</li><li>1/4 Cup of crushed pineapple,well drained</li></ol>",recipe : "<ul><li>Preheat oven to gas 4</li><li>Mix together butter,sugar and eggs in a large bowl.</li><li>Beat in flour,bicarbonate of soda and salt.</li><li>Stir in pineapple.</li><li>Spread into a 9x9 square tin for bars,or into cupcake shells.</li><li>Cook gas 4 for 40/45 mins.</li><li>Drizzle with lemon icing.</li></ul>"
}

iced = {
    name: "Iced Cream Buns",ingredients: "<ol><li>2 tsp or 17g Pack dried yeast</li><li>4 floz Warm water</li><li>2 1/2 oz Sugar</li><li>4 floz Warm milk</li><li>2 1/2 oz Butter melted (weight first)</li><li>1 tsp Salt</li><li>1 Egg,slightly beaten</li><li>20 oz Bread flour</li></ol>",recipe : "<ul><li>Put flour in stand mixer bowl with yeast on one side,salt on the other</li><li>Mix together milk,egg,melted butter and 3 oz of warm water</li><li>Add sugar to flour and yeast then mix for a few seconds</li><li>Add the liquid - might need a litle more warm water</li><li>Put mixer on for 3 minutes,adding a little more water if needed</li><li>Put in large greased bowl and leave to double in size</li><li>Cut dough into about 15 pieces and place onto a greased baking tray then leave to double in size</li><li>Cook in preheated oven,180 deg/Gas 4 for 20 minsm then add plain iced glaze on top</li></ul>"
}

toff = {
    name: "Sticky Toffee Pudding",ingredients: "<ol><li>225g Dates</li><li>175ml Boiling water</li><li>1tsp Vanilla</li><li>1 tsp Bi carbonate of soda</li><li>175g S.R Flour</li><li>2 Eggs</li><li>85g Butter</li><li>100ml Milk</li><li>140g demorara sugar</li></ol><p>Toffee Sauce:</p><ol><li>175kg Dark brown sugar</li><li>50g Butter</li><li>225ml Double cream</li><li>1 tbsp Black treacle</li></ol>",recipe : "<ul><li>Soak dates in boiling water.</li><li>Mix flour and Bicarbonate of soda.</li><li>Beat eggs.</li><li>Beat butter and sugar until creamy,then add eggs a little bit at a time.</li><li>stir in treacle then fold in 1/3 of the flour,1/2 the milk,then repeat until used.</li><li>Stir in soaked dates *note* may look curdled (it isn't)</li><li>Spoon into mini pudding basins.</li><li>Cook gas 4 for 20 - 25 mins.</li></ul><p>Sauce:</p><ul><li>Put butter and sugar in a pan with 1/2 the cream and bring it to boil</li><li>Stir until sugar has dissolved,then stir in treacle and bubble for a few minutes.</li><li>Take off heat and beat in rest of cream.</li></ul>"
}

document.querySelectorAll('.card').forEach(item => {
    item.addEventListener("mouseover",function() {
        this.classList.remove("fader");
    });
})

document.querySelectorAll('.card').forEach(item => {
    item.addEventListener("mouseout",function() {
        this.classList.add("fader");
    });
})


function recipecard(obj) {
    name.innerHTML = obj.name;
    ingredients.innerHTML = obj.ingredients; 
    recipe.innerHTML = obj.recipe;
}

document.querySelectorAll('.card').forEach(item => {
    item.addEventListener("click",function() {
        obj = this.id.toString()
        recipecard(obj)
    });
})

在最后一个功能中-

document.querySelectorAll('.card').forEach(item => {
    item.addEventListener("click",function() {
        obj = this.id.toString()
        recipecard(obj)
    });
})

obj返回一个ID名称，该ID名称与包含用于馈送配方卡函数的信息的对象名称相对应，但是HTML仍返回Undefined。谁能告诉我我做错了什么？

我也尝试过直接使用

recipecard(this.id)

还返回undefined。我是编码的新手，所以我敢肯定我必须忽略一些东西。

谢谢。