Replace wrapping symbols on tags

formatter.js

export const escape = (string) => string.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&')

export const replaceSymbolOnTag = (str, symbol, tagName) => {
  const regexp = new RegExp(`${escape(symbol)}(.*?)${escape(symbol)}`, 'gi')
  return str.replace(regexp, `<${tagName}>$1</${tagName}>`)
}

export const replacer = (selectors = [], symbol = '#', tagName = 'span') => {
  const $elements = []

  selectors.forEach((selector) => {
    $elements.push(...Array.from(document.querySelectorAll(selector)))
  })

  $elements.forEach(($element) => {
    $element.innerHTML = replaceSymbolOnTag($element.innerHTML, symbol, tagName)
  })
}

index.js

import { replaceSymbolOnTag, replacer } from './formatter'

// Working with string
replaceSymbolOnTag('hello *world*', '*', 'b') // hello <b>world</b>
replaceSymbolOnTag('hello _world_', '_', 'i') // hello <i>world</i>
replaceSymbolOnTag('hello ~world~', '~', 's') // hello <s>world</s>
replaceSymbolOnTag('hello #world#', '#', 'span') // hello <span>world</span>

// Working with html selectors
replacer(['.title', '.article'], '#', 'span')