Grouping MarkDown elements in to DIV element or Custom html tag -

i have used jeykll tool generate mark down content html .

i want group below mark down elements in div element or other custom html tag.

marked down

 #multiple axis     {:.title}     different types of data can visualized in single chart of      {: .description}     can used when need compare trends of different kinds of data.     {: .description} 

html output

  <h1 id="multiple-axis" class="title">multiple axis</h1>     <p class="description">different typ`enter code here`es of data can visualized in single chart of</p>     <p class="description">it can used when need compare trends of different kinds of data.</p> 

how group above markdown div element or custom tag this

<div class="">          <h1 id="multiple-axis" class="title">multiple axis</h1>         <p class="description">different types of data can visualized in single chart of</p>         <p class="description">it can used when need compare trends of different kinds of data.</p>            </div> 

the answer depends in part on markdown parser using. happens, jekyll supports few different markdown parsers. , may need set options on parser using enable appropriate features.

generally speaking, markdown requires use raw html div. syntax rules explain:

markdown not replacement html, or close it. syntax small, corresponding small subset of html tags. idea not create syntax makes easier insert html tags. in opinion, html tags easy insert. idea markdown make easy read, write, , edit prose. html publishing format; markdown writing format. thus, markdown’s formatting syntax addresses issues can conveyed in plain text.

for markup not covered markdown’s syntax, use html itself.

however, syntax rules state:

note markdown formatting syntax not processed within block-level html tags. e.g., can’t use markdown-style *emphasis* inside html block.

in other words, need define entire div , in raw html. essentially, need copy desired output question above , paste markdown document.

however, markdown parsers have added additional functionality allows various shortcuts. example, appears parser using supports assigning attributes various parts of document without falling raw html -- leads me believe using kramdown has documented support attribute lists.

as turns out, kramdown includes optional support parsing markdown content inside html blocks. while docs explain of options, basic idea if set attribute of markdown=1 on raw html tag, content of tag parsed html. this:

<div markdown=1> parsed *markdown* content. </div> 

which generate following html output:

<div> <p>this parsed <emphasis>markdown</emphasis> content.</p> </div> 

of course, can assign class on div well. therefore, final document this:

<div class="someclass" markdown=1>  #multiple axis {:.title}  different types of data can visualized in single chart of  {: .description}  can used when need compare trends of different kinds of data. {: .description}  #multiple axis {:.title}  different types of data can visualized in single chart of  {: .description}  can used when need compare trends of different kinds of data. {: .description}  </div> 

of course, if using different markdown parser, need consult parser's documentation see if supports similar non-standard feature.