diff --git a/packages/website/ts/pages/jobs/benefits.tsx b/packages/website/ts/pages/jobs/benefits.tsx
index 8a44eb596b..006facc83c 100644
--- a/packages/website/ts/pages/jobs/benefits.tsx
+++ b/packages/website/ts/pages/jobs/benefits.tsx
@@ -75,7 +75,7 @@ export const BenefitsList = () => {
     return (
         <div>
             <HeaderItem headerText={HEADER_TEXT} />
-            {_.map(BENEFIT_ITEM_PROPS_LIST, valueItemProps => React.createElement(BenefitItem, valueItemProps))}
+            {_.map(BENEFIT_ITEM_PROPS_LIST, valueItemProps => <BenefitItem {...valueItemProps} />)}
         </div>
     );
 };
diff --git a/packages/website/ts/pages/jobs/teams.tsx b/packages/website/ts/pages/jobs/teams.tsx
index 8112351dbd..80b036396d 100644
--- a/packages/website/ts/pages/jobs/teams.tsx
+++ b/packages/website/ts/pages/jobs/teams.tsx
@@ -48,11 +48,11 @@ const LargeLayout = () => (
     <div className="mx-auto max-width-4 clearfix pb4">
         <div className="col lg-col-6 md-col-6 col-12">
             <HeaderItem headerText={HEADER_TEXT} />
-            {_.map(TEAM_ITEM_PROPS_COLUMN1, teamItemProps => React.createElement(TeamItem, teamItemProps))}
+            {_.map(TEAM_ITEM_PROPS_COLUMN1, teamItemProps => <TeamItem {...teamItemProps} />)}
         </div>
         <div className="col lg-col-6 md-col-6 col-12">
             <HeaderItem headerText=" " />
-            {_.map(TEAM_ITEM_PROPS_COLUMN2, teamItemProps => React.createElement(TeamItem, teamItemProps))}
+            {_.map(TEAM_ITEM_PROPS_COLUMN2, teamItemProps => <TeamItem {...teamItemProps} />)}
         </div>
     </div>
 );
@@ -60,9 +60,9 @@ const LargeLayout = () => (
 const SmallLayout = () => (
     <div>
         <HeaderItem headerText={HEADER_TEXT} />
-        {_.map(_.concat(TEAM_ITEM_PROPS_COLUMN1, TEAM_ITEM_PROPS_COLUMN2), teamItemProps =>
-            React.createElement(TeamItem, teamItemProps),
-        )}
+        {_.map(_.concat(TEAM_ITEM_PROPS_COLUMN1, TEAM_ITEM_PROPS_COLUMN2), teamItemProps => (
+            <TeamItem {...teamItemProps} />
+        ))}
     </div>
 );
 
diff --git a/packages/website/ts/pages/jobs/values.tsx b/packages/website/ts/pages/jobs/values.tsx
index 799db3d670..ad62754ce9 100644
--- a/packages/website/ts/pages/jobs/values.tsx
+++ b/packages/website/ts/pages/jobs/values.tsx
@@ -29,7 +29,7 @@ export const Values = () => {
     return (
         <div className="mx-auto max-width-4">
             <HeaderItem headerText={HEADER_TEXT} />
-            {_.map(VALUE_ITEM_PROPS_LIST, valueItemProps => React.createElement(ValueItem, valueItemProps))}
+            {_.map(VALUE_ITEM_PROPS_LIST, valueItemProps => <ValueItem {...valueItemProps} />)}
         </div>
     );
 };