title: How do I repeatedly append or add html in jquery?
body: <p>I have code that uses <code>.repeat()</code> to inject a string a number of times based on the input number given.</p>
  
  <p>But I want to inject characters/symbols, and/or elements that use html specifically to get the styling I want. In this case, I want to produce a number of circles to indicate a level of skill.</p>
  
  <p>As you can see, I got a string to work in the repeat() function, but I want to repeat html instead.</p>
  
  <p>This is a snippet from a react app. I don't want to use the ">" symbol as the repeated unit, I want to repeat something more complex like a div or a font awesome icon.</p>
  
  <pre><code>displayDevSkill = () =&gt; {
    return Object.values(this.state.skills).map(skill =&gt;
      &lt;div className="skill"&gt;
        &lt;Fade&gt;&lt;div className="skill-level"&gt;{this.skillLevelMeasure(skill.level)}&lt;/div&gt;&lt;/Fade&gt;
        &lt;div className="skill-leveltitle"&gt;{skill.leveltitle}&lt;/div&gt;
        &lt;div className="skill-title" id={skill.id}&gt;{skill.title}&lt;/div&gt;
        &lt;i className={skill.icon}&gt;&lt;/i&gt;
      &lt;/div&gt;
    )
  }
  
  skillLevelMeasure = (level) =&gt; {
    let unit = "&gt;"
    return unit.repeat(level)
  }
  </code></pre>
  
  <p>I want to have something like repeated circles or html elements.</p>