jQuery String selector add string from file

Question

I have a line that creates a simple box like so:

var box = $('<button>').addClass('box');

With using the css:

.box {

    border-radius: 0.7vw;

    width: 40vw;

    height: 50vw;

    margin: 30px;

    display: inline-block;

    background-color: #d87c2d;

}

All fine, I get those boxes, I can even click on them.

But what I really need is generating some usable elements.

For that, I usually like to keep components separate (hope I use the correct terminology), so I made a text file with the following content:

<div>

    <div class="tile" id="eventName"> Event name</div><br/>

    <div class="tile" id="eventDate">2017.01.01. </div>

    <div class="tile" id="eventTime">12.00</div><br/> 

    <div class="tile" id="description">Some boring example description about the meaningless </div>

</div>

My goal is to put this inside the

$(-here-)

instead of the simple

<button>

I have there.

To get that I tried

var box = $('/html/tileInside').addClass('box');

but didn't work, I believe JS thinks I want just the

string

/html/tileInside there which obviously doesn't mean anything.

So is there a way to add a

string

from a txt file inside the jQuery string selector?

Recommended for you: Get network issues from WhatsUp Gold. Not end users.

Answer 1

Use ajax here.

$('<div></div>').load('/html/tileInside');

http://api.jquery.com/load/

http://api.jquery.com/jQuery.ajax/

jQuery String selector add string from file

Sign up