How to use the mjml-core.helpers.startConditionalTag function in mjml-core

backgroundHeight = $element.data('background-height')

      backgroundCropTop = dataCrop.split(', ')[0].split(':')[1]
      backgroundCropBottom = dataCrop.split(', ')[1].split(':')[1]

      $element
        .removeAttr('class')
        .removeAttr('data-background-height')
        .removeAttr('data-crop')
    }

    backgroundWidth = parseInt(backgroundWidth.replace('px', '')) * 0.75
    backgroundHeight = parseInt(backgroundHeight.replace('px', '')) * 0.75

    $(this)
      .before(`${helpers.startConditionalTag}
          
        ${helpers.endConditionalTag}`)
      .removeAttr('class')
      .removeAttr('data-background-width')
      .removeAttr('data-background-height')
      .removeAttr('data-background-url')
  })

$mjHeroContent.each(function () {
    const width = $(this).css('width')
    const align = $(this).data('align')
    const backgroundColor = $(this).data('background-color')

    $(this).before(`${helpers.startConditionalTag}
      <table style="width:${width};" width="${width.replace('px', '')}" align="${align}" cellspacing="0" cellpadding="0" border="0" role="presentation"><tbody><tr><td style="padding:0;background-color:${backgroundColor};">
      ${helpers.endConditionalTag}`)
    .after(`${helpers.startConditionalTag}
      </td></tr></tbody></table>
      ${helpers.endConditionalTag}`)
    .removeAttr('data-background-color')
    .removeAttr('data-align')
  })

$('.mj-section-outlook-background').each(function () {
    const url = $(this).data('url')
    const width = parseInt($(this).data('width'))

    $(this)
      .removeAttr('class')
      .removeAttr('data-url')
      .removeAttr('data-width')

    if (!url) {
      return
    }

    $(this).before(`${helpers.startConditionalTag}
      
        
        
      ${helpers.endConditionalTag}`)

    $(this).after(`${helpers.startConditionalTag}
        <p style="margin:0;mso-hide:all">&nbsp;</p>
        
      
      ${helpers.endConditionalTag}`)
  })

$('.mj-social-outlook-open').each(function () {
    $(this).replaceWith(`${helpers.startConditionalTag}
      <table align="${$(this).data('align')}" cellspacing="0" cellpadding="0" border="0" role="presentation"><tbody><tr><td>
      ${helpers.endConditionalTag}`)
  })
</td></tr></tbody></table>

$('.mj-wrapper-outlook-open').each(function () {
    $(this).replaceWith(`${helpers.startConditionalTag}
      <table cellspacing="0" cellpadding="0" border="0" role="presentation"><tbody><tr><td style="width:${parseInt($(this).data('width'))}px;">
      ${helpers.endConditionalTag}`)
  })
</td></tr></tbody></table>

$('.mj-container-outlook-line').each(function () {
    $(this).replaceWith(`${helpers.startConditionalTag}
      
      ${helpers.endConditionalTag}
      ${helpers.startConditionalTag}
      <table style="width:${containerWidth}px;" align="center" width="${containerWidth}" cellspacing="0" cellpadding="0" border="0" role="presentation">
        <tbody><tr>
          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
      ${helpers.endConditionalTag}`)
  })
</td></tr></tbody></table>