Hi,

Currently I am building the application in samsung S3 gear , where somewhere I need to display the data coming from the API dynamically in the form of sections using tau .But I got strucked somewhere.

Below is the code ,I am using :-

JS———–

function addMedPage (page) {

    var next = page + 1;

    var section = document.createElement(‘section’);

  section.className = page == 0 ? ‘ui-section-active’: ”;

    section.id = ‘med’+page;

    section.innerHTML = ‘<div class=”left-btn”>X</div>\

        <div class=” p-t-50 container-content” >\

      <div id=”med-img’ +page+ ‘”>’+page+‘</div>\

          <div id=”med-name’ +page+ ‘” style=”word-break: break-all;”></div>\

          <div><span>at </span><span id=”med-time’ +page+ ‘”></span></div>\

          <div id=”med-popuptext’ +page+ ‘”></div>\

          <div id=”med-foodtext’ +page+ ‘”></div>\

       </div>\

    <div class=”right-btn”>X</div>’;

    document.getElementById(‘medication-page’).appendChild(section);

}

HTML——-

    <div id=“pageIndicatorPage” class=“ui-page” data-enable-page-scroll=“false”>

        <div id=“pageIndicator” class=“ui-page-indicator”></div>

        <div id=“hsectionchanger” class=“ui-content”>

            <div id=“medication-page”  >

 Sections are getting appending if I check the inspect element but they are created vertically.

 Each section should appear horizontally in the form of caurosel.