all.js

let data=[
    
    {
        image:"https://www.sephora.com/productimages/sku/s2577872-main-zoom.jpg?imwidth=320",
        name:"PAT McGRATH LABS",
        detail:"Skin Fetish: Divine Blush Duo",
        info:"Mascara",
        price:"34.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2419786-main-zoom.jpg?imwidth=320",
        name:"OLEHENRIKSEN",
        detail:"Firmly Yours Dry Body Oil with Peptides",
        info:"Facial Razor Set",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2555811-main-zoom.jpg?imwidth=320",
        name:"HAUS LABS BY LAD.",
        detail:"Bio-Radiant Gel- Powder Highlighter.",
        info:"Sampler Set",
        price:"35.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2588515-main-zoom.jpg?imwidth=320",
        name:"Moroccanoil",
        detail:"Signature Scent Duo",
        info:"Hourglasss",
        price:"324.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2366524-main-zoom.jpg?imwidth=320",
        name:"HAUS LABS BY LAD..",
        detail:"Power Sculpt Velvet Bronzer with ",
        info:"Mascara",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2578011-main-zoom.jpg?imwidth=320",
        name:"WASO",
        detail:"KOSHIRICE Acne Calming Spot",
        info:"Total Coverage Angled Sponge-",
        price:"87.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2333771-main-zoom.jpg?pb=clean-planet-positive-badge-2021&imwidth=320",
        name:"tarte",
        detail:"Maracuja Juicy Glow Highlighting Stick",
        info:"Total Coverage Blending",
        price:"76.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2172310-main-zoom.jpg?imwidth=320",
        name:"MAKEUP BY MARIO",
        detail:"SoftSculpt@ Transforming Skin",
        info:"Lipstick",
        price:"23.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2407278-main-zoom.jpg?imwidth=320",
        name:"WASO",
        detail:"SHIKULIME Gel-to-Oil Cleanser",
        info:"Removing Cleansing Balm",
        price:"98.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2536308-main-zoom.jpg?pb=2020-03-sephora-clean-2019&imwidth=320",
        name:"Summer Fridays.",
        detail:"ShadeDrops Broad Spectrum SPF 30",
        info:"Mascara",
        price:"26.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2571966-main-zoom.jpg?pb=2020-03-sephora-clean-2019&imwidth=320",
        name:"amika",
        detail:"Hydro Rush Intense Moisture Conditione..",
        info:"Highlighter",
        price:"27.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2457299-main-zoom.jpg?imwidth=320",
        name:"WASO",
        detail:"YUZU-C Eye Awakening Essence",
        info:"Creme",
        price:"10.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2592012-main-zoom.jpg?imwidth=320",
        name:"WASO",
        detail:"YUZU-C Eye Awakening Essence",
        info:"Eyeshadow Palette",
        price:"28.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2572238-main-zoom.jpg?pb=2020-03-sephora-clean-2019&imwidth=320",
        name:"WASO",
        detail:"KOSHIRICE Acne Calming Spot",
        info:"Mascara",
        price:"25.10"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2605244-main-zoom.jpg?pb=clean-planet-positive-badge-2021&imwidth=320",
        name:"PAT McGRATH LABS",
        detail:"Skin Fetish: Divine Blush Duo",
        info:"Facial Razor Set",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2605244-main-zoom.jpg?pb=clean-planet-positive-badge-2021&imwidth=320",
        name:"OLEHENRIKSEN",
        detail:"Firmly Yours Dry Body Oil with Peptides",
        info:"Facial Razor Set",
        price:"97.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2594810-main-zoom.jpg?imwidth=320",
        name:"HAUS LABS BY LAD.",
        detail:"Bio-Radiant Gel- Powder Highlighter.",
        info:"Mini Bronze Eyeshadow Palette",
        price:"98.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2589422-main-zoom.jpg?imwidth=320",
        name:"Moroccanoil",
        detail:"Signature Scent Duo",
        info:"Mascara Value Set",
        price:"29.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2600856-main-zoom.jpg?imwidth=270",
        name:"Too Faced",
        detail:"Chocolate Soleil Natural",
        info:"Bronzer",
        price:"21.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2546463-main-zoom.jpg?pb=2020-03-sephora-value-2020&imwidth=270",
        name:"WASO",
        detail:"YUZU-C Eye Awakening Essence",
        info:"MascCremeara",
        price:"05.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2588960-main-zoom.jpg?imwidth=270",
        name:"WASO",
        detail:"KOSHIRICE Acne Calming Spot",
        info:"Masfhufha",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2595007-main-zoom.jpg?imwidth=270",
        name:"PAT McGRATH LABS",
        detail:"Skin Fetish: Divine Blush Duo",
        info:"Lipstick",
        price:"75.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2554418-main-zoom.jpg?pb=clean-planet-positive-badge-2021&imwidth=270",
        name:"OLEHENRIKSEN",
        detail:"Firmly Yours Dry Body Oil with Peptides",
        info:"Super",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2591139-main-zoom.jpg?imwidth=270",
        name:"HAUS LABS BY LAD.",
        detail:"Bio-Radiant Gel- Powder Highlighter.",
        info:"Eye Shdow",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2593739-main-zoom.jpg?pb=clean-planet-positive-badge-2021&imwidth=270",
        name:"Moroccanoil",
        detail:"Signature Scent Duo",
        info:"CREAme",
        price:"23.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2593739-main-zoom.jpg?pb=clean-planet-positive-badge-2021&imwidth=270",
        name:"HAUS LABS BY LAD..",
        detail:"Power Sculpt Velvet Bronzer with ",
        info:"Masccomebackara",
        price:"13.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2587665-main-zoom.jpg?imwidth=270",
        name:"tarte",
        detail:"Maracuja Juicy Glow Highlighting Stick",
        info:"Juicy",
        price:"22.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2563096-main-zoom.jpg?imwidth=270",
        name:"MAKEUP BY MARIO",
        detail:"SoftSculpt@ Transforming Skin",
        info:"Mario",
        price:"92.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2594703-main-zoom.jpg?imwidth=270",
        name:"WASO",
        detail:"SHIKULIME Gel-to-Oil Cleanser",
        info:"Cleanser",
        price:"67.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2558690-main-zoom.jpg?pb=clean-planet-positive-badge-2021&imwidth=270",
        name:"Summer Fridays.",
        detail:"ShadeDrops Broad Spectrum SPF 30",
        info:"SPF",
        price:"28.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2587087-main-zoom.jpg?imwidth=270",
        name:"amika",
        detail:"Hydro Rush Intense Moisture Conditione..",
        info:"Hydro",
        price:"35.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2589760-main-zoom.jpg?pb=2020-03-sephora-clean-2019&imwidth=270",
        name:"WASO",
        detail:"YUZU-C Eye Awakening Essence",
        info:"Essence",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2583250-main-zoom.jpg?imwidth=270",
        name:"WASO",
        detail:"KOSHIRICE Acne Calming Spot",
        info:"Spot",
        price:"24.40"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2567824-main-zoom.jpg?imwidth=270",
        name:"PAT McGRATH LABS",
        detail:"Skin Fetish: Divine Blush Duo",
        info:"Blusher",
        price:"97.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2590370-main-zoom.jpg?imwidth=270",
        name:"OLEHENRIKSEN",
        detail:"Firmly Yours Dry Body Oil with Peptides",
        info:"Oil",
        price:"46.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2578037-main-zoom.jpg?imwidth=320",
        name:"HAUS LABS BY LAD.",
        detail:"Bio-Radiant Gel- Powder Highlighter.",
        info:"Radient",
        price:"22.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2601243-main-zoom.jpg?imwidth=270",
        name:"Moroccanoil",
        detail:"Signature Scent Duo",
        info:"Scent",
        price:"35.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2589612-main-zoom.jpg?imwidth=270",
        name:"only at sephora",
        detail:"ONE/SIZE by Patrick Starrr",
        info:"Mascara",
        price:"34.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2593861-main-zoom.jpg?imwidth=270",
        name:"Sephora Favorites",
        detail:"Luxe Vibes Luxury Beauty",
        info:"Sampler Set",
        price:"35.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2586741-main-zoom.jpg?imwidth=270",
        name:"PAT McGRATH LABS",
        detail:"Skin Fetish: Divine Blush Duo",
        info:"Hourglasss",
        price:"324.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2594810-main-zoom.jpg?imwidth=270",
        name:"Hourglasss",
        detail:"Ambient Soft Glow Foundation",
        info:"Mascara",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2497204-main-zoom.jpg?pb=2020-03-sephora-value-2020&imwidth=270",
        name:"SEPHORA COLLECTION.",
        detail:"Bio-Radiant Gel- Powder Highlighter.",
        info:"Total Coverage Angled Sponge-",
        price:"87.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2497220-main-zoom.jpg?pb=2020-03-sephora-value-2020&imwidth=270",
        name:"SEPHORA COLLECTION",
        detail:"Signature Scent Duo",
        info:"Total Coverage Blending",
        price:"76.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2546505-main-zoom.jpg?imwidth=270",
        name:"Urban Decay",
        detail:"Vice Lip Bond Glossy Liquid",
        info:"Lipstick",
        price:"23.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2546497-main-zoom.jpg?pb=2020-03-sephora-value-2020&imwidth=270",
        name:"Farmacy",
        detail:"Peaches 'N Clean Makeup",
        info:"Removing Cleansing Balm",
        price:"98.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2589653-main-zoom.jpg?imwidth=270",
        name:"MAKEUP BY MARIO",
        detail:"SoftSculpt@ Transforming Skin",
        info:"Mascara",
        price:"26.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2588770-main-zoom.jpg?pb=clean-planet-positive-badge-2021&imwidth=270",
        name:"Givenchy",
        detail:"Pink Collection Prisme Libre",
        info:"Highlighter",
        price:"27.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2588515-main-zoom.jpg?imwidth=270",
        name:"OLEHENRIKSEN",
        detail:"Banana Bright+ Vitamin C Eye",
        info:"Creme",
        price:"10.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2577443-main-zoom.jpg?imwidth=270",
        name:"Too Faced",
        detail:"Better Than Chocolate",
        info:"Eyeshadow Palette",
        price:"28.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2592012-main-zoom.jpg?imwidth=320",
        name:"WASO",
        detail:"YUZU-C Eye Awakening Essence",
        info:"Mascara",
        price:"25.10"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2591147-main-zoom.jpg?imwidth=270",
        name:"SEPHORA COLLECTION",
        detail:"KOSHIRICE Acne Calming Spot",
        info:"Facial Razor Set",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2593309-main-zoom.jpg?pb=2020-03-sephora-clean-2019&imwidth=270",
        name:"PAT McGRATH LABS",
        detail:"Skin Fetish: Divine Blush Duo",
        info:"Facial Razor Set",
        price:"97.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2592012-main-zoom.jpg?imwidth=270",
        name:"Natasha Denona",
        detail:"Firmly Yours Dry Body Oil with Peptides",
        info:"Mini Bronze Eyeshadow Palette",
        price:"98.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2540201-main-zoom.jpg?imwidth=270",
        name:"Benefit Cosmetics.",
        detail:"BANGin' Deal Volumizing.",
        info:"Mascara Value Set",
        price:"29.00"
    },
    {
        image:"https://www.sephora.com/productimages/sku/s2600856-main-zoom.jpg?imwidth=270",
        name:"Too Faced",
        detail:"Chocolate Soleil Natural",
        info:"Bronzer",
        price:"21.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/bpme/July/2022-bpme-bi-sku-point-multiplier-site-desktop-mobile-app-beauty-offers-banner-4x-tarte.jpg",
        name:"Get 4X Pointstt",
        detail:"Beauty Insider members only",
        info:"Mario",
        price:"92.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/May/2022-complexion-story-site-desktop-mobile-beauty-offers-page-banner-sample-bag-1000x750-us.jpg",
        name:"Try bestselling complexion",
        detail:"Free with $35 purchase.",
        info:"Masfhufha",
        price:"25.00"
        
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/July/2022-07-18-slotting-promo-app-site-desktop-mobile-dtext-beauty-offers-page-banner--SULWHASOOGIFT-us-ca-handoff.jpg",
        name:"CORmplimentary Sulwhasoo Size Set",
        detail:"Complimentary ",
        info:"Removing Cleansing Balm",
        price:"98.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/May/2022-5-25-briogeo-superfoods-site-desktop-mobile-app-beauty-offers-page-banner-en-us-can.jpg",
        name:"Augustinu",
        detail:"Target",
        info:"Eyeshadow Palette",
        price:"28.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/July/2022-7-12-ceremonia-site-desktop-mobile-app-beauty-offers-page-banner-en-us.jpg",
        name:"Ceremonia",
        detail:"Free with $25 purchase.",
        info:"SPF",
        price:"28.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/July/2022-7-13-july-skincare-challenge-site-desktop-mobile-app-beauty-offers-page-beauty-offer-new-en-us-can.jpg",
        name:"Free Sol de Janeiro Samples",
        detail:"Plump skin",
        info:"Removing Cleansing Balm",
        price:"98.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/July/2022-7-1-sol-de-janeiro-limited-edition-mists-site-desktop-mobile-app-beauty-offers-page-banner-en-us-can.jpg",
        name:"Free Sol de Janeiro Trial Size",
        detail:"Brazilian Bum Bum.",
        info:"Cleanser",
        price:"67.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/June/2022-6-23-laneige-water-bank-collection-relaunch-site-app-beauty-offers-page-banner.jpg",
        name:"Free LANEIGE Trial Size",
        detail:"EXclusions/terms apply.",
        info:"Mario",
        price:"92.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/June/2022-6-18-june-hair-challenge-site-desktop-mobile-app-beauty-offers-page-banner-en-us-can.jpg",
        name:"Free Moroccanoil Samples",
        detail:"EXclusions/terms apply.",
        info:"CREAme",
        price:"23.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/June/2022-06-05-slotting-promo-app-site-beauty-offers-banner-LUXURYSKIN-us-ca-handoff.jpg",
        name:"Complimentary Luxe Skincare",
        detail:"Beauty Insider",
        info:"Eye Shdow",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/June/2022-june-body-app-home-page-content-card-PROMO-f1.jpg",
        name:"Get 4X Pointstt",
        detail:"ttExclusions",
        info:"Super",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/May/2022-5-25-briogeo-superfoods-site-desktop-mobile-app-beauty-offers-page-banner-en-us-can.jpg",
        name:"Danessa Myricks",
        detail:"Free with .",
        info:"Lipstick",
        price:"75.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/May/2022-complexion-story-site-desktop-mobile-beauty-offers-page-beauty-offers-banner-choose-1-of-3-1000x750-us.jpg",
        name:"CORmplimentary Sulwhasoo Size Set",
        detail:"Complimentary with $85 Sulwhasoo purchase ",
        info:"Masfhufha",
        price:"25.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/March/2022-apr-clinical-skincare-site-desktop-mobile-app-beauty-offers-page-banner-promo-3-1000x750-us.jpg",
        name:"Complimentary Augustinus",
        detail:"Target wrinkles, dullness.",
        info:"MascCremeara",
        price:"05.00"
    },
    {
        image:"https://www.sephora.com/contentimages/promo/beautyoffers/2022/April/2022-apr-warby-paid-foundation-der-a-site-app-home-page-content-card-1000x750-us.jpg",
        name:"Free Trial Size from Ceremonia",
        detail:"Free with $25 purchase.",
        info:"Bronzer",
        price:"21.00"
    },
]

let addArr=JSON.parse(localStorage.getItem("cartData")) || [];

data.forEach(function(elem,index){


    let box=document.createElement("div");
    let image=document.createElement("img");
    image.setAttribute("src",elem.image);
    let p1=document.createElement("p");
    p1.innerText=elem.name;
    let p2=document.createElement("p");
    p2.innerText=elem.detail;
    let p3=document.createElement("p");
    p3.innerText=elem.info
    let p4=document.createElement("p");
    p4.innerText=elem.price;
    let btn=document.createElement("button");
    btn.innerText="Add to Cart";
    btn.addEventListener("click",function(){

        addHere(elem);
    })

    box.append(image,p1,p2,p3,p4,btn);
    document.querySelector("#main").append(box);
})

function addHere(elem){

    let image=elem.image;
    let name=elem.name;
    let info=elem.info;
    let price=elem.price

    let addObj={

        image:image,
        name:name,
        info:info,
        price:price,
    }

    addArr.push(addObj);
    localStorage.setItem("cartData",JSON.stringify(addArr));
    
}